jquery搜索匹配元素

我正在實施基於擊鍵的搜索可見元素在一個div（機場屬於一個國家）。換句話說，在每個按鍵事件中，我隱藏文本中沒有匹配短語的所有元素（不區分大小寫）。jquery搜索匹配元素

再一次發現，搜索只能在符合國家ID的元素上完成。

的HTML（C＃剃刀）是：

<div class="airport" id="[email protected](airport.CountryId)-" name="[email protected](airport.AirportId)-"> 
    <a ...etc> 
    @airport.Airport <span class="airport-country">@airport.Country</span> 
    </a> 
</div>

我有這個JavaScript來隱藏不符合國家ID的元素，但我需要擴展，以包括搜索匹配，而且我米不知道如何做到這一點。

$('[id^="airport-c"][id!="airport-c' + countryId + '-"]').hide();

來源

2013-06-22 Savage

我不確定c＃razor是如何工作的。用戶如何進入搜索？ – rednaw

這將是這樣的：

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

上面的語句將匹配包含搜索項，這是div裏面有ID #airport-c" + countryId + "-"

見working demo任何<a>元素。

來源

2013-06-22 10:52:11 Nelson

感謝您的演示。不幸的是，結果不區分大小寫。我的要求也適用於相反的情況（即選擇不匹配的元素以隱藏它們）。 – Savage

我包裝在一個「不」，並實現了一個自定義包含功能。 – Savage

我建議使用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'); 
});

Fiddle here。

或者如果你不能/不想改變標記，你可以使用包含選擇器。

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

來源

2013-06-22 10:49:07 mcNux

不知道發生了什麼事，但是當我測試那個小提琴演示時，我得到了奇怪的結果。輸入't'是好的，然後將它改爲'tt'，不要改變。全部刪除，然後輸入'o'，然後突出顯示。（Chrome和FF） – Savage

我的不好，沒有代碼來取消突出顯示不匹配的結果。 – Savage

對不起，只是一個簡單的例子來展示這個想法。 – mcNux

jquery搜索匹配元素

回答

相關問題