javascript - Jquery 列表过滤需要帮助

Question

你好，我想改变一个列表过滤的小功能，而不是过滤li，我想扫描包含相同列表的div的多个ul标签其中的元素怎么可能呢

这是我的js代码

$( document ).ready(function() {
  $('#s').keyup(function(){
   var valThis = $(this).val().toLowerCase();
    $('.domain_pricing_list>li').each(function(){
     var text = $(this).text().toLowerCase();
        (text.indexOf(valThis) == 0) ? $(this).show() : $(this).hide();            
   });
  });
});

这是我的 html

<input placeholder="Search..." id="s" type="text" /> 
<div class="domain_pricing_list">
    <ul>
        <li><span>TLD</span>.com</li>
        <li><span>Duration</span>1 Year</li>
        <li><span>Registration</span>$10</li>
        <li><span>Renewal</span>$10.45</li>
        <li><span>Transfer</span>$10.33</li> 
    </ul>

    <ul>
        <li><span>TLD</span>.net</li>
        <li><span>Duration</span>1 Year</li>
        <li><span>Registration</span>$10</li>
        <li><span>Renewal</span>$10.45</li>
        <li><span>Transfer</span>$10.33</li> 
    </ul>

    <ul>
        <li><span>TLD</span>.org</li>
        <li><span>Duration</span>1 Year</li>
        <li><span>Registration</span>$10</li>
        <li><span>Renewal</span>$10.45</li>
        <li><span>Transfer</span>$10.33</li> 
    </ul>    
</div>

Answer 1

CSS 选择器不正确。应该是:

$('.domain_pricing_list > ul >li')

.domain_pricing_list > li 表示“.domain_pricing_list”元素的直接子元素。根据你的 HTML 没有这样的 child 。 .domain_pricing_list 的直接后代是 ul 标记。

演示: http://jsfiddle.net/06kvcmqq/