jq学习代码11-----复选框全选反选
来源:互联网 发布:网络高清图片 编辑:程序博客网 时间:2024/05/11 23:36
<!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title> <!-- 引入jQuery --><script src="../../scripts/jquery.js" type="text/javascript"></script> <script type="text/javascript">$(function(){ //全选 $("#CheckedAll").click(function(){ //所有checkbox跟着全选的checkbox走。 $('[name=items]:checkbox').attr("checked", this.checked ); }); $('[name=items]:checkbox').click(function(){ //定义一个临时变量,避免重复使用同一个选择器选择页面中的元素,提升程序效率。 var $tmp=$('[name=items]:checkbox'); //用filter方法筛选出选中的复选框。并直接给CheckedAll赋值。 $('#CheckedAll').attr('checked',$tmp.length==$tmp.filter(':checked').length); /* //一行做过多的事情需要写更多注释。复杂选择器还可能影响效率。因此不推荐如下写法。 $('#CheckedAll').attr('checked',!$('[name=items]:checkbox').filter(':not(:checked)').length); */ }); //输出值 $("#send").click(function(){ var str="你选中的是:\r\n"; $('[name=items]:checkbox:checked').each(function(){ str+=$(this).val()+"\r\n"; }) alert(str); });}); </script></head><body><form method="post" action=""> 你爱好的运动是?<input type="checkbox" id="CheckedAll" />全选/全不选<br/> <input type="checkbox" name="items" value="足球"/>足球 <input type="checkbox" name="items" value="篮球"/>篮球 <input type="checkbox" name="items" value="羽毛球"/>羽毛球 <input type="checkbox" name="items" value="乒乓球"/>乒乓球<br/> <input type="button" id="send" value="提 交"/> </form></body></html>
阅读全文
0 0
- jq学习代码11-----复选框全选反选
- 复选框全选/反选代码
- 复选框全选反选
- 复选框全选,反选
- 复选框全选/反选
- 复选框(checkbox)全选/全不选/反选代码
- jq获取复选框的值(全选,反选等)
- js写全选按钮、全不选按钮、反选按钮、全选全不选复选框代码
- 复选框的全选、全不选、反选
- 复选框全选与反选函数
- JS 复选框 全选 反选
- 关于复选框全选与反选
- 复选框全选、全不选和反选
- 复选框的全选、反选、全不选
- 复选框的全选与反选
- 全选和反选复选框
- Jquery 复选框全选、反选
- 复选框应用-全选/全不选/反选
- cookie,localStorage,sessionStorage
- 什么是跨域?怎么解决跨域问题?
- 成年人的世界里,没有男女两个字
- jq代码学习10--文本框高度变化(内容滚动)
- spring.profiles.active=dev
- jq学习代码11-----复选框全选反选
- < 笔记 > Python
- MIS
- elasticsearch分布式集群搭建
- 【CodeForces】 670D1
- Centos使用 upzip 命令
- jq代码学习12---下拉框左右选择
- 做老板后才明白,这4种打工思维会慢慢毁掉你的未来
- BZOJ 2244 拦截导弹 cdq分治