jquery checkbox选框操作

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 2 <html>
 3   <head>
 4     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
 5     <script type="text/javascript" src="../js/jquery-1.8.2.js"></script>
 6   </head>
 7   <body>
 8     <table border="1" align="center">
 9         <tr>
10             <th>状态</th>
11             <th>用户名</th>
12         </tr>
13         <tr>
14             <td><input type="checkbox"/></td>
15             <td>赵</td>
16         </tr>
17         <tr>
18             <td><input type="checkbox"/></td>
19             <td>钱</td>
20         </tr>
21         <tr>
22             <td><input type="checkbox"/></td>
23             <td>孙</td>
24         </tr>
25         <tr>
26             <td><input type="checkbox"/></td>
27             <td>李</td>
28         </tr>
29         <tr>
30             <td><input type="checkbox"/></td>
31             <td>周</td>
32         </tr>
33         <tr>
34             <td><input type="button" value="全选中"/></td>
35             <td><input type="button" value="全取消"/></td>
36             <td><input type="button" value="全反选"/></td>
37         </tr>
38     </table>
39     <script type="text/javascript">
40         //页面加载时，将全取消按钮失效
41         window.onload = function(){
42             $(":button:eq(1)").attr("disabled","disabled");
43         }
44         //全选中
45         $(":button:eq(0)").click(function(){
46             //所有复选框设置为选中状态
47             $(":checkbox").attr("checked","checked");
48             //将该按钮失效
49             $(this).attr("disabled","disabled");
50             //将全取消按钮生效
51             $(":button:eq(1)").removeAttr("disabled");
52         });
53         //全取消
54         $(":button:eq(1)").click(function(){
55             //所有选中的复选框删除选中属性
56             $(":checkbox:checked").removeAttr("checked");
57             //将该按钮失效
58             $(this).attr("disabled","disabled");
59             //将全选中按钮生效
60             $(":button:eq(0)").removeAttr("disabled");
61         });
62         //全反选
63         $(":button:eq(2)").click(function(){
64
65             //将选中的失效
66             $(":checkbox:checked").attr("disabled","disabled");
67
68             //将未选中的选中
69             $(":checkbox:not(:checked)").attr("checked","checked");
70
71             //将失效的生效，同时删除选中属性
72             $(":checkbox:disabled").removeAttr("disabled").removeAttr("checked");
73
74         });
75     </script>
76   </body>
77 </html>

全反选或者

 1     $(":button:eq(2)").click(function(){
 2         $(":checkbox").each(function(){
 3             if($(this).attr("checked")!=null)
 4             {
 5                 $(this).removeAttr("checked");
 6             }
 7             else
 8             {
 9                 $(this).attr("checked","checked");
10             }
11         });
12
13     });

jquery checkbox选框操作

时间： 2024-11-05 23:07:17

jquery checkbox选框操作的相关文章

jQuery复选框操作

<html> <head> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript"> $(function(){ $('#CheckedAll').click(function(){ $('[name=items]:checkbox').attr('

jquery checkbox的相关操作——全选、反选、获得所有选中的checkbox

jquery checkbox的相关操作——全选.反选.获得所有选中的checkbox 1.全选 $("#btn1").click(function(){ $("input[name='checkbox']").attr("checked","true"); }) 2.取消全选(全不选) $("#btn2").click(function(){ $("input[name='checkbox']&

jQuery 复选框全选/取消全选/反选

jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type="text/javascript" src="../js/jquery-1.9.1.js"></script> <script type="text/javascript"> $(document).ready(fun

复选框操作

C#：复选框操作类

? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 using System; using System.Collections.Gener

jQuery复选框全选全不选代码

<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="author" content="http://www.51texiao.cn/" /><title>jQuery复选框全选全不选代码<

Thymeleaf+layui+jquery复选框回显

一.Thymeleaf+layui+jquery复选框回显基于Thymeleaf模板下的layui+jquery复选框回显,主要是jquery.大致意思是:把数组转成JSON传到前台,再在前台转回数组 AJAX一般都是用JSON格式或XML格式来传递数据的JSON就是一种具有特殊格式的字符串. 1.实体类属性 1 //顾客等级 2 private Integer[] constomerGradeArray; 3 //用来存储json格式的顾客等级数组(方便数据传输) 4 private Str

jQuery复选框全选/取消全选

jQuery复选框注意jquery版本的更新兼容问题使用兼容1.6+所有版本 $("#selAll").on("click", function () { if($("#selAll").prop("checked") == true){ $("input[id='iid']").each(function(){ $(this).prop("checked", true); });

python之tkinter使用-复选框操作

1 # tkinter复选框操作 2 3 import tkinter as tk 4 5 root = tk.Tk() 6 root.title('问卷调查') 7 root.geometry('220x80') # 设置窗口大小 8 9 flag_1 = False 10 flag_2 = False 11 flag_3 = False 12 list_content = ['你的爱好是:'] 13 hobby_list = ['游泳', '唱歌', '旅游'] 14 15 16 def c