需要Jquery列表筛选帮助

Jquery list filtering help required

本文关键字：帮助 筛选 列表 Jquery 需要      更新时间：2023-09-26

你好，我想更改列表过滤的一个小功能，而不是过滤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>

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

$('.domain_pricing_list > ul >li')

.domain_pricing_list > li表示".domain_pricing_list"元素的直接子元素。根据你的HTML，没有这样的孩子。.domain_pricing_list的直接后代是ul标签。

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

相关文章：