jQuery搜尋框輸入內容查找表格內是否符合程式碼
程式碼片段:
function search(){
// 取得搜尋框的值
var kwds = $("#searchInput").val();
// 取得第一個清單內容
var this_one = {};
var real_name = '';
// 定義資料清單
var list = $("#all_list .list_one");
// 定義尋找的起始值
var true_one = 0;
for (var i = 0; i < list.length; i++) {
this_one = $(list[i]);
real_name = this_one.text().toString();
// 執行like匹配
if(real_name.match(kwds)){
// 處理第目前的結果
if(true_one == active){
// 取得視窗的寬度與高度
var windows_wdh = $(window).width();
var windows_hgt = $(window).height();
// 取得第一個座標
var x_len = this_one.offset().left;
var y_len = this_one.offset().top;
// 驅動捲軸捲動到指定的位置
$("html,body").animate({scrollTop:(y_len-windows_hgt/2), scrollLeft:(x_len-windows_wdh/2)},500);
// 標記目前選取的結果
this_one.addClass('active');
this_one.removeClass('on');
}else{
// 標記符合的結果
this_one.addClass('on');
this_one.removeClass('active');
}
// 累加真實的選擇
true_one++;
}else{
this_one.removeClass('on');
}
}
// 判斷是否搜尋完畢 如果搜尋完畢 則從第一個開始 否則繼續搜尋下一個
active = active >= true_one-1 ? 0 : active+1;
return false;
}
本站所有資源皆由網友貢獻或各大下載網站轉載。請自行檢查軟體的完整性!本站所有資源僅供學習參考。請不要將它們用於商業目的。否則,一切後果都由您負責!如有侵權,請聯絡我們刪除。聯絡方式:admin@php.cn
相關文章
30 Nov 2024
在 jQuery 中選擇具有特定 CSS 屬性的元素問題:我們如何有效地選擇擁有特定 CSS 屬性的所有元素...
06 Dec 2024
使用 jQuery 和 JavaScript 解析 JSON 資料這個簡短的教程解決了有效操作 JSON 資料的挑戰,特別是...
19 Nov 2024
使用 jQuery 最佳化 HTML 元素建立以增強效能當使用 jQuery 建立動態介面時,必須...
03 Dec 2024
jQuery $(document).ready 和 UpdatePanels:精緻的外觀當利用 jQuery 將滑鼠懸停效果應用於 UpdatePanel 中的元素時,...
08 Dec 2024
設定隱藏可見性的 jQuery 等效項在 jQuery 中,.show() 和 .hide() 方法通常用於操作顯示屬性...
Hot Tools
jQuery2019情人節表白放煙火動畫特效
一款抖音上很火紅的jQuery情人節表白放煙火動畫特效,適合程式設計師、科技宅用來向心愛的女孩告白,無論你選擇願意或不願意,到最後都得同意。
layui響應式動畫登入介面模板
layui響應式動畫登入介面模板
520情人節表白網頁動畫特效
jQuery情人節表白動畫、520表白背景動畫
酷炫的系統登入頁
酷炫的系統登入頁
HTML5卡音樂播放器-CASSETTE PLAYER
HTML5卡音樂播放器-CASSETTE PLAYER