2012-05-08 16 views
0

私はこのリンクに似た仕切りでフィルタリングされたリストを持っています。私は自分のコンテンツが空であるときに仕切りが隠されていないことを除いて例とまったく同じように働いています。これは達成しようとしているものです。各divについて、その子要素がすべて非表示の場合、前の要素を非表示にしますか?

http://jquerymobile.com/test/docs/lists/lists-search-with-dividers.html

keyUpイベント内のコードの最初のブロックは、リストをフィルタリングするために動作しますが、私は第二ブロックを追加するときにそれが壊れます。

$("#filter").keyup(function() { 
    var filter = $(this).val(), count = 0; 
    $(".filtered:first li").each(function() { 

     if ($(this).text().search(new RegExp(filter, "i")) < 0) { 

      $(this).addClass("hidden"); 
     } else { 
      $(this).removeClass("hidden"); 
      count++; 
     } 

    }); 

    //code i've added 
    $('.li-group').each(function(){ 
     if($(this).children(':visible').length == 0) { 
      $(this).prev().css('display','none'); 
     } 
    }): 

}); 

私のHTMLは、このような構造を持っている:そしてdiv.li-groupのすべての子が隠されている場合は、それぞれからkeyupイベントに、チェックして、私は私のコードをどうしようとしていた何

<li class="divider">A</li> 
<div class="li-group"> 
    <li> 
    <a href="#">Link</a> 
    </li> 
    <li> 
    <a href="#">Link</a> 
    </li> 
</div> 

<li class="divider">B</li> 
<div class="li-group"> 
    <li> 
    <a href="#">Link</a> 
    </li> 
    <li> 
    <a href="#">Link</a> 
    </li> 
</div> 

、そうであればリストのディバイダである前の要素を非表示にします。

注、私は知っている私のコードは、現在unsemanticですが、私は戻って、コードをクリーンアップする前に、私は私のデモが機能して取得したいです。

+0

その罰金を修正http://jsfiddle.net/QStkd/19/ – thecodeparadox

+0

私はkeyupイベントを追加しないとき:http://jsfiddle.net/jamesbrighton/C5vKM/ – Evans

答えて

1

linkあなたはコメントで与えられたが、jQueryのコードのエラーが含まれています:

$("#filter").keyup(function() { 
    $('.li-group').each(function(){ 
     if($(this).children(':visible').length == 0) { 
      $(this).prev().css('display','none'); 
     } 
    }): 
    ^should be ; 
}); 

私はあなたのコードがうまくうまくいくと思うエラーと

Corrected Code

関連する問題