jQuery表格資料條件篩選程式碼
程式碼片段:
js程式碼
<script type="text/javascript"> $(function(){ //要綁定的表格類別名 var choosetable=".choosetable"; var checkarray=[]; //循環遍歷table的th加入篩選清單中 $(choosetable+" th").each(function(){ checkarray.push($(this).text()); }); for (var i = 0; i < checkarray.length/3; i++) { if(i<checkarray.length/3-1||checkarray.length%3==0){ var checktext=""; for (var j = 0; j < 3; j++) { checktext+="<div class='choosediv'><label class='checkbox'><input type='checkbox' checked value='"+((i*3)+j)+"'> ; "+checkarray[((i*3)+j)]+" </label> </div>"; } }else{ var checktext=""; for (var j = 0; j <checkarray.length%3; j++) { checktext+="<div class='choosediv'><label class='checkbox'><input type='checkbox' checked value='"+((i*3)+j)+"'> ; "+checkarray[((i*3)+j)]+" </label> </div>"; } } $(".modal-body").append("<div class='chooses'>"+checktext+"</div>"); } $("#choosebtn").click(function(){ var choosearr=[]; $(".checkbox input").each(function(){ //alert($(this).is(":checked")); if(!$(this).is(":checked")){ choosearr.push($(this).val()); } }) //alert(choosearr); $(choosetable+" tr").each(function(){ $(this).children().show(); }); for(var i=0;i<choosearr.length;i++){ $(choosetable+" tr").each(function(){ $(this).children().eq(choosearr[i]).hide(); }); } }); //全選/全不選 $("#allchecked").click(function(){ if(this.checked){ $(".checkbox input").prop("checked", true); }else{ $(".checkbox input").prop("checked", false); } }); }) </script>
本站所有資源皆由網友貢獻或各大下載網站轉載。請自行檢查軟體的完整性!本站所有資源僅供學習參考。請不要將它們用於商業目的。否則,一切後果都由您負責!如有侵權,請聯絡我們刪除。聯絡方式:admin@php.cn
相關文章
01 Feb 2018
有時候也會需要在前端進行資料篩選,增強互動體驗。當資料可用的篩選條件較多時,把邏輯寫死會為後期維護帶來很*煩。以下是我自己寫的一個簡單的篩選器,篩選條件可以根據資料包含的欄位動態設定。
20 Jul 2023
如何透過Vue和Excel實現表格資料的多條件篩選隨著資料的不斷增多,我們往往需要在表格中進行多條件的篩選,以便快速定位符合我們需求的資料。在Vue和Excel的幫助下,我們可以輕鬆實現這項功能。首先,我們需要在Vue中引入Excel文件,並將其轉換為可操作的資料格式。這可以透過使用papaparse庫來實現。以下是引入和轉換Excel檔案的程式碼範例:<
16 May 2016
一條數據創建一行,如果數量大的時候,一次性要加載完數據的話,瀏覽器就會卡上半天,下面有個不錯的方法,大家可以參考下
04 May 2017
這篇文章主要介紹了asp.net實現的MVC跨數據庫多表聯合動態條件查詢功能,結合實例形式較為詳細分析了asp.net基於MVC架構的跨數據庫多表聯合查詢功能實現技巧,需要的朋友可以參考下
22 Jul 2017
實現過程是這樣的:前台通過jquery的ajax調用一般處理程序(Handler),獲取表格需要顯示的信息,然後轉換成json格式返回給前台,前台獲取到數據後循環構建表格的行,最好把行附加到表裡。 目標: a 熟悉簡單JQuery Ajax的使用
22 Jul 2017
我們往往不是透過提交表單來處理這些數據,因為如果在後台去遍歷處理這些大量的數據是非常繁瑣的;比較好的做法是在前台頁面中將數據以對象形式保存在json中,然後在後台直接將json轉換成我們需要的對象,這樣我們的直接可以處理對象了!
Hot tools Tags
Hot Tools
jQuery2019情人節表白放煙火動畫特效
一款抖音上很火紅的jQuery情人節表白放煙火動畫特效,適合程式設計師、科技宅用來向心愛的女孩告白,無論你選擇願意或不願意,到最後都得同意。
layui響應式動畫登入介面模板
layui響應式動畫登入介面模板
520情人節表白網頁動畫特效
jQuery情人節表白動畫、520表白背景動畫
酷炫的系統登入頁
酷炫的系統登入頁
HTML5卡音樂播放器-CASSETTE PLAYER
HTML5卡音樂播放器-CASSETTE PLAYER