Question

我想用“可搜索”类对div进行搜索，但我不确定应该如何选择它。我之前尝试过像代码之类的东西，但它没有用。

                $('#SEARCH').change(function () {
                //if (e.which == 13) {
                    var txt = $('#SEARCH').val();
                    $('.divin').each(function(){
                       if($(this + ' > .searchable').text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
                           $(this).hide();
                       }
                    });
                //}
            });

（$（此+'＆gt; .searchable'）不正确

HTML：

<li id="listItem_156" class="divin">
<div style="width:30px;">
    <a href="#?w=800" rel="popup_name" id="156" class="poplight">
        <img height="16" style="cursor:move;" width="16" src="img/arrow.png" border="0"  />
    </a>
</div>
<div style="width:220px;" class="searchable">
    <a href="action=MemberDetails&item=156" class="body">Mike Frank </a> 
</div>
<div style="width:110px;">
    0 
</div>

Answer 1

使用jQuery.find

if($(this).find(' >.searchable').text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
      $(this).hide();
}

Answer 2

为什么不直接这个

 $('.divin .searchable').each(function(){

因此

 $('#SEARCH').change(function () {
                //if (e.which == 13) {
                    var txt = $('#SEARCH').val();
                    $('.divin .searchable').each(function(){
                       if($(this).text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
                           $(this).parent().hide();
                       }
                    });
                //}
            });

Answer 3

您有两种方式：

首先使用.find()：

$('.divin').each(function(){
   if($(this).find('> .searchable').text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
        $(this).hide();
   }
});

第二个具有这样的给定上下文：

$('.divin').each(function(){
   if('> .searchable', this).text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
        $(this).hide();
   }
});

Answer 4

in jsfiddle

    $('#SEARCH').change(function () {
        var txt = $('#SEARCH').val();
        $('.divin .searchable').show().filter(function () {
              return $(this).text().toUpperCase().indexOf(txt.toUpperCase()) === -1
        }).hide();

    });

如何在特定父级下只选择一个div

4 个答案: