jquery隐藏/显示问题

Question

我有一个如下所示的列表:

<span id="contacts_tab_contacts_list_list"> 
                <li><span id="contact_35">John</span> 
                </li> 
                <li><span id="contact_36">Ron a</span> 
                </li> 
                <li><span id="contact_33">Ron b</span> 
                </li> 
                <li><span id="contact_34">35</span> 
                </li> 
                <li><span id="contact_39">33</span> 
                </li> 
                <li><span id="contact_37">66</span> 
                </li> 
                <li><span id="contact_38">77</span>
...
</span>

我有一个<input>用来过滤列表的jQuery.我试着用这两jQuery行来做:

$("#contacts_tab_contacts_list_list").children().hide();
$("#contacts_tab_contacts_list_list:contains('" + searchValue + "')").show();

因此,例如,输入Ron到搜索框中会让contact_36并contact_33在列表中唯一可见的元素.该hide()部分有效.在show()没有.

我究竟做错了什么？(假设searchValue在这种情况下具有正确的值Ron)

有一个更好的方法吗？

谢谢!

Answer 1

尝试将选择范围缩小到嵌套span元素:

$("#contacts_tab_contacts_list_list li span:contains('" + searchValue + "')").show();