0

タグに含まれているもの<div>に関して表示または非表示にするフィルターを実行しようとしています。data-type

これが私のJavascriptです：

var course_difficulty_level_filter= function(el,level) 
  {
    this.el = el;
    this.el.closest('#courses_content').find("div").hide();
    if(level != "00"){
      this.el.closest('#courses_content').find('div[data-difficulty="'+level+'"]').show();
      console.log("show difficulty_level : "+ level);
    } else {
      this.el.closest('#courses_content').find("div").show();
      console.log("show difficulty_level : all");
    };
  }

$('#course_filter_level1').click(function(){

  $(this).click(course_difficulty_level_filter($(this),"1"));

});

そして、ここに私のHTMLがあります:

<div id="coursefilter">
    <div id="coursefilter_content" class="hide">

        <div id="coursefilter_content_text">
            <div id="course_filter_level_text"><p class="course_filter">Level: </p></div>       
        </div>

        <div id="coursefilter_content_icons">
            <div id="course_filter_level">
                <div id="course_filter_level1" class="opacityquarter"> 
                    <div id="level1_rectangle1"></div>
                    <div id="level1_rectangle2"></div>
                    <div id="level1_rectangle3"></div>
                    <div id="level1_rectangle4"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--Courses - Course Overviews-->
<div id="courses">
    <div id="courses_content" class="hide">
        <div class="course_overview_content_even" data-difficulty="1" data-lang="en"></div>
    </div>
</div>

を正常に取得したconsole.log => show difficulty_level : 1ので、スクリプトは「機能」していますが、DOM をナビゲートできないと思いますが、その理由はわかりません。

4

2 に答える 2

3

あなたは単に探していますか：

$('div[data-difficulty="'+level+'"]').show();
$('div[data-difficulty="'+level+'"]').hide();

jQuery は HTML 属性のクエリを豊富にサポートしています: http://api.jquery.com/category/selectors/attribute-selectors/

于 2013-08-20T14:26:05.870 に答える