使用jquery中:contains選擇器實現模糊搜尋、匹配關鍵字效果。
body
.warp
/*清除input預設樣式*/
input
/*搜尋欄*/
.search_box
.search_box input
.search_box .search_icon
/*搜尋內容*/
.search_content
.search_content ul
.search_content li
.search_content li:last-child
.search_content li a
$(function()
$(".search_content li:contains(" + search_input.val().trim() + ")").show();
$(".search_content li:not(:contains(" + search_input.val().trim() + "))").hide();
//第二中方法
//$(".search_content li").hide().filter(":contains("+ search_input.val().trim() +")").show();
});});
開發步驟：
1.使用 keyup 鍵盤鬆開事件，當鍵盤鬆開時觸發以下內容。
2. 先獲取 input 輸入框中的內容。
3. 利用 jquery 中 :contains 選擇器判斷 li 標籤中的內容是否包含 input 輸入框中的內容。
4.如果包含則該 li 標籤顯示，否則 則隱藏。
jQuery 如何實現 模糊搜尋
如何實現 模糊搜尋 當我們瀏覽網頁的時候，通常能看到搜尋欄，這大大的提高了我們獲取資料的目的性。那如何去實現乙個簡單的模糊搜尋 框呢，以下案例獲取能給你一點思路。以下案例，可以實現當按鍵按下時，自動檢索匹配資料 基本css 樣式 row 基本的html 樣式 自己建立乙個商品資料集合 點選分類時實現...
iOS實現模糊效果
void setimagetoblur uiimage image blurradius cgfloat blurradius clamp setvalue sourceimage forkey kciinputimagekey ciimage clampresult clamp valuefork...
Unity Shader實現模糊效果
今天分享乙個超簡單實現模糊效果的方法，先上圖 核心 就這句 注意要在3.0以上的版本才能使用 在取樣後做偏移取樣再疊加，效果與下面的 類似 float4 frag v2f o sv target 下面的完整 shader custom testshader40 scale scale range 0...