首页  ·  知识 ·  前端
Jquery:全选取消反选复选框的实现
shineqiujuan  博客园|  综合  编辑:德仔   图片来源:网络
color: #000000; background-color: #ffff00lt;%/ color: #000000; backgro
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   
<title>无标题页</title>
   
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
   
<script language="javascript" type="text/javascript">
   $(
function(){
   $(
"#Button1").click(function(){
        $(
"#form1 :checkbox").each(function(){$(this).attr("checked",true)})})
        $(
"#Button2").click(function(){
            $(
"#form1 :checkbox").each(function(){
               
if($(this).attr("checked"))
                {
                    $(
this).attr("checked",false);
                }
               
else
                {
                      $(
this).attr("checked",true);
                }
            });
        })
        $(
"#Button3").click(function(){
        $(
"#form1 :checkbox").each(function(){$(this).attr("checked",false)})})
   })
   
</script>

</head>
<body>
   
<form id="form1" runat="server">
   
<table border="1" style="width: 13%;">
       
<tr>
           
<td>
               
<input id="Checkbox1" type="checkbox" />
           
</td>
       
</tr>
       
<tr>
           
<td>
               
<input id="Checkbox2" checked type="checkbox" />
           
</td>
       
</tr>
       
<tr>
           
<td>
               
<input id="Checkbox3" type="checkbox" />
           
</td>
       
</tr>
       
<tr>
           
<td>
               
<input id="Checkbox4" type="checkbox" />
           
</td>
       
</tr>
       
<tr>
           
<td>
               
<input id="Checkbox5" type="checkbox" />
           
</td>
       
</tr>
       
<tr>
           
<td>
               
<input id="Checkbox6" type="checkbox" />
           
</td>
       
</tr>
   
</table>
   
</form>
   
<input id="Checkbox7" type="checkbox" />
<p>
   
<input id="Button1" type="button" value="全选" /><input id="Button2"
        type
="button" value="反选" /><input id="Button3" type="button" value="取消" /></p>
</body>
</html>
本文作者:shineqiujuan 来源:博客园|
CIO之家 www.ciozj.com 微信公众号:imciow
   
免责声明:本站转载此文章旨在分享信息,不代表对其内容的完全认同。文章来源已尽可能注明,若涉及版权问题,请及时与我们联系,我们将积极配合处理。同时,我们无法对文章内容的真实性、准确性及完整性进行完全保证,对于因文章内容而产生的任何后果,本账号不承担法律责任。转载仅出于传播目的,读者应自行对内容进行核实与判断。请谨慎参考文章信息,一切责任由读者自行承担。
延伸阅读