jQuery如何实现复选框全选和全不选:在网页中经常有复选框的全选和全不选效果,比如在后台新闻管理、用户空间信息管理等都有用到,下面就提供一个jQuery实现的此效果。代码实例如下:<!DOCTYPE HTML><html><head>< ...
jQuery如何实现复选框全选和全不选:
在网页中经常有复选框的全选和全不选效果,比如在后台新闻管理、用户空间信息管理等都有用到,下面就提供一个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复选框全选全不选代码</title><script type="text/javascript" src='/images/loading.gif' data-original="mytest/jQuery/jquery-1.8.3.js"></script><script type="text/javascript"> $.fn.checkCbx=function(){ return this.each(function(){ this.checked = !this.checked; })} $(function(){ $("#btnSelect").click(function(){ this.value = this.value == "全选"?"反选":"全选"; $("input:checkbox").checkCbx(); }) }) </script></head><body><form name="form1" method="post" action="Default8.aspx" id="form1"> <table border="1"> <tr> <th>选择</th> <th>id</th> <th>姓名</th> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>1</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>2</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>3</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>4</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>5</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>6</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>7</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>8</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>9</td> <td>蚂蚁部落</td> </tr> <tr> <td><input type="checkbox" name="cbx" /></td> <td>10</td> <td>蚂蚁部落</td> </tr> </table> <input id="btnSelect" type="button" value="全选" /></form></body></html>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:jQuery如何实现复选框全选和全不选
关键词:jquery
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。