匹配元素的Jquery搜索

我正在对div（属于某个国家的机场）中的可见元素实施基于击键的搜索。换句话说，在每个向上键事件中，我隐藏文本中没有匹配短语（不区分大小写）的所有元素

还有一个问题，搜索只能在匹配国家id的元素上进行

html（C#Razor）是：

---

我建议使用

data-

属性并使用属性包含选择器。比如说

<p>
    <input type="text" id="q"/>
</p>
<ul>
    <li data-name="one">One</li>
    <li data-name="two">Two</li>
    <li data-name="three">Three</li>
    <li data-name="four">Four</li>
</ul>

$('#q').on('keyup', function(){
  $('li[data-name*="' + $('#q').val() + '"]').css('color', 'red');
});

---

应该是这样的：

$("a:contains('"+your_search_term+"')", "#airport-c" + countryId + "-");

---

以上语句将与任何

匹配，我不确定c#razor是如何工作的。用户如何输入搜索？不确定发生了什么，但当我测试fiddler演示时，我得到了奇怪的结果。键入“t”可以，然后将其更改为“tt”，没有更改。删除所有内容并键入“o”并突出显示所有内容。（Chrome和FF）我的错，没有代码取消突出显示不匹配的结果。感谢演示。不幸的是，结果不区分大小写。我的要求也适用于相反的情况（即选择不匹配的元素以隐藏它们）。我用一个“not”包装并实现了一个自定义contains函数。
<p>
    <input type="text" id="q"/>
</p>
<ul>
    <li data-name="one">One</li>
    <li data-name="two">Two</li>
    <li data-name="three">Three</li>
    <li data-name="four">Four</li>
</ul>

$('#q').on('keyup', function(){
  $('li[data-name*="' + $('#q').val() + '"]').css('color', 'red');
});

$("li:contains('" + $('#q').val() + "')").css('color', 'red');

$("a:contains('"+your_search_term+"')", "#airport-c" + countryId + "-");