2. 程式人生 > >jq表格全反選實例

jq表格全反選實例

阿新 • • 發佈：2017-07-14
remove order table 反選 body 單選 checked lec 表格

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .backcolor{ background: #8A2BE2; } </style> <script src="js/jquery-1.4.1.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript">
$(function(){ //單選 $("#tab tbody tr input").click(function(){ $(this).parent().parent().toggleClass("backcolor"); }); //全選、全不選 $("#selAll").click(function(){ $("#selAgainst").attr("checked",""); if($(this).attr("checked")){ $("#tab tbody tr").addClass("backcolor");
$("#tab tbody tr input[type=checkbox]").attr("checked","checked") }else{ $("#tab tbody tr").removeClass("backcolor"); $("#tab tbody tr input[type=checkbox]").removeAttr("checked") } }); //反選 $("#selAgainst").click(function(){ $("#selAll").attr("checked",""); $("#tab tbody tr").toggleClass("backcolor");
$("#tab tbody tr input[type=checkbox]").each(function(){ if($(this).attr("checked")!=true){ $(this).attr("checked","checked"); }else{ $(this).removeAttr("checked") } }); }); }); </script> </head> <body> <table border="1" width="350px" id="tab"> <thead> <tr> <th>學號</th> <th>姓名</th> <th>性別</th> <th>班級</th> </tr> <tr> <td colspan="4"><input type="checkbox" id="selAll"/>全選/全不選 <input type="checkbox" id="selAgainst"/>反選 </td> </tr> </thead> <tbody> <tr> <td><input type="checkbox"/>s001</td> <td>小白</td> <td>女</td> <td>t111</td> </tr> <tr> <td><input type="checkbox"/>s002</td> <td>小黑</td> <td>男</td> <td>t111</td> </tr> <tr> <td><input type="checkbox"/>s003</td> <td>小強</td> <td>男</td> <td>t112</td> </tr> <tr> <td><input type="checkbox"/>s004</td> <td>張三</td> <td>男</td> <td>t113</td> </tr> <tr> <td><input type="checkbox"/>s005</td> <td>小蘭</td> <td>女</td> <td>t113</td> </tr> </tbody> </table> </body></html>

jq表格全反選實例

相關推薦

jq表格全反選實例

remove order table 反選 body 單選 checked lec 表格 <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>&

Python3.6全棧開發實例[008]

是什麽 進行 元素 alex 變量 追加 pri python 實現 8.有如下變量（tu是個元祖），請實現要求的功能:tu = ("alex", [11, 22, {"k1": ‘v1‘, "k2": ["age", "name"], "k3": (11,22,33)},

Python3.6全棧開發實例[007]

rate span 完成 參數 col 數據類型 turn 類型 全棧 7.此函數只接收一個參數且此參數必須是列表數據類型，此函數完成的功能是返回給調用者一個字典，此字典的鍵值對為此列表的索引及對應的元素。例如傳入的列表為：[11,22,33] 返回的字典為 {0:11,1

Python3.6全棧開發實例[010]

字符串 字符 clas pan code pre pri 3.6 開發實例 10.有字符串 "k:1|k1:2|k2:3|k3:4" 處理成字典 {‘k‘:1,‘k1‘:2....} s = "k:1|k1:2|k2:3|k3:4" dic = {} l1 = s.spl

Python3.6全棧開發實例[015]

isdigit () print key 投票 ice ict 3.6 NPU 15.電影投票:程序先給出幾個目前正在上映的電影列表. 由用戶給每個電影投票.最終將該用戶投票信息公布出來 lst = [‘北京遇上西雅圖‘, ‘解救吳先生‘, ‘美國往事‘, ‘西西裏的美麗傳

Python3.6全棧開發實例[013]

信息 評論 spa 3.6 ace nbsp code col 出現 13.用戶輸入的信息,如果出現了列表中的敏感詞匯,請用*替代. li = ["蒼老師","東京熱","武藤蘭","波多野結衣"] comment = input(‘請輸入評論‘) ne

Python3.6全棧開發實例[009]

pytho ems app key 所有 insert nbsp 全棧 lex 9.字典dic,dic = {‘k1‘: "v1", "k2": "v2", "k3": [11,22,33]}a.請循環輸出所有的key for i in dic.keys(): pr

Python3.6全棧開發實例[012]

pen 價格 while 重新 用戶輸入 choice code bre 打印 12.輸出商品列表，用戶輸入序號，顯示用戶選中的商品(升級題) 商品列表： goods = [{"name": "電腦", "price": 1999}, {"name

Python3.6全棧開發實例[016]

nbsp {} python 裏的 NPU print 打分 電影 pan 16.電影打分:程序先給出幾個目前正在上映的電影列表. 由用戶給每個電影投票.最終將該用戶投票信息公布出來 lst = [‘北京遇上西雅圖‘, ‘解救吳先生‘, ‘美國往事‘, ‘西西裏的美麗傳說‘

Python3.6全棧開發實例[017]

print ont con 一個數 需要 python3.6 class put python3 17.念數字:給出一個字典,在字典中標識出每個數字的發音,包括相關符號,然後由用戶輸入一個數字,讓程序讀出相對應的發音(不需要語音輸出.單純的打印即可). dics = {

Python3.6全棧開發實例[018]

山東 python3 python3.6 pytho none 獲取 劃分 rst fir 18.車牌區域劃分, 現給出以下車牌.根據車牌的信息, 分析出各省的車牌持有量.(升級題) result = {} for car in cars: location =

Python3.6全棧開發實例[019]

val hub print += sum bsp 刪除 items class 19.幹掉主播.現有如下主播收益信息, 按照要求, 完成相應操作:(1)計算主播平均收益值 sum = 0 for i in zhubo.values(): sum +=i print

Python3.6全棧開發實例[020]

開發 input else 全棧 style 實例 是否 clas NPU 20.判斷一個數是否是水仙花數, 水仙花數是一個三位數, 三位數的每一位的三次方的和還等於這個數. 那這個數就是一個水仙花數, 例如: 153 = 1**3 + 5**3 + 3**3 num =

Python3.6全棧開發實例[021]

循環 col pre 序列 升級 div rem 例如 3.6 21.給出一個純數字列表. 請對列表進行排序(升級題). 思路: (1)完成a和b的數據交換. 例如, a = 10, b = 24 交換之後, a = 24, b = 10(2)循環列表. 判斷a[i]和a[

Python3.6全棧開發實例[023]

一個 python3.6 font 部分 多少 col -i 如果 content 23.稅務部門征收所得稅. 規定如下: (1)收入在2000以下的. 免征. (2)收入在2000-4000的, 超過2000部分要征收3%的稅. (3)收入在4000-6000的, 超過

javascript控件（二）：一個好用的表格（分頁實例）

etime rec 提示 pan table style sid search 計算 一、官網 https://datatables.net/ 二、引用 <script src="bower_components/datatables.net/js/jquery

AngularJs 增刪改查+刪除+批量刪除+全反選

<head> <meta charset="utf-8" /> <script src="js/angular.min.js" type="text/javascript" charset="utf-8"></s

(安卓) 購物車二級列表，計算和全反選 以及 EventBus（訊息傳遞）

先看效果圖： MainActivity; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.View; import androi

10.8-全棧Java筆記:序列化/反序列化的步驟和實例

java 本節我們詳細講解10.3節中提到的序列化和反序列化操作。序列化和反序列化是什麽當兩個進程遠程通信時，彼此可以發送各種類型的數據。 無論是何種類型的數據，都會以二進制序列的形式在網絡上傳送。比如，我們可以通過http協議發送字符串信息；我們也可以在網絡上直接發送JAVA對象。發送方需要把這個Java對

JavaScript實現全選選項框的功能和鼠標劃入出現下拉框的功能--JavaScript實例集錦（初學）

bubuko 技術分享 選項 round div ++ length javascrip brush 有一些論壇，文章後臺編輯都會出現選擇框的操作。 1.實現選項框全選和取消全選的功能： 代碼實現： <!DOCTYPE html> <html>