jQuery是一種非常流行的JavaScript庫,可以幫助開發者在Web應用程序中快速簡單地實現各種功能。其中,使用jQuery實現input篩選是非常常見的一種應用。
通過在input中輸入關鍵字,可以對頁面上顯示的內容進行篩選,只顯示符合條件的內容。這種功能通常應用在搜索框、表格篩選等場景中。
$(document).ready(function(){ $('#input').on('keyup', function(){ var inputValue = $(this).val(); $('table tr').hide(); $('table tr:contains('+inputValue+')').show(); }); });
以上是一個簡單的jQuery篩選代碼。使用on函數監聽input的keyup事件,輸入關鍵字時觸發代碼執行。獲取input的值,然后隱藏表格中的所有行,最后只顯示符合關鍵字的行。
其中,:contains選擇器是jQuery提供的一個字符串匹配選擇器,用于匹配包含指定文本的元素。它不區分大小寫,因此對于大多數場景可用。
此外,還可以根據需求添加其他功能,比如添加按下回車鍵跳轉到搜索結果頁面、顯示搜索結果數量、清空輸入框中的內容等等。
總之,使用jQuery實現input篩選是一種非常實用的功能,可以幫助用戶快速找到所需要的信息。同時,開發者也可以根據需求進一步優化代碼,提高用戶體驗。