checkbox选中与取消选择
先上代码
<form>
你爱好的运动是?<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="CheckAll" value="全选" />
<input type="button" id="CheckNo" value="全不选" />
<input type="button" id="CheckRev" value="反选" />
</form>
想要实现的是全选,全不选和反选三种效果,其中需要特别注意的是全选按钮这里
<script>
$(function(){
$("#CheckAll").click(function(){
$("input:checkbox").prop("checked","checked");
});
$("#CheckNo").click(function(){
$("input:checkbox").removeAttr("checked");
});
$("#CheckRev").click(function(){
$("input:checkbox").each(function(){
this.checked=!this.checked;
});
});
});
</script>
请注意,现在使用的是prop(),如果使用attr(),那么就会出现下面这种情况:
选择“全选”按钮后,正常;点击“全不选”,正常;当这个时候再去点击“全选”按钮时,发现代码那里的“checked”=checked,但是页面上没有显示出来;
使用prop()方法后,可以解决此问题;
。。。。没有测浏览器的兼容。。。。
checkbox选中与取消选择的更多相关文章
- JQuery设置checkbox选中或取消等相关操作
$("[name='checkbox']").attr("checked",'true');//全选 $("[name='checkbox']&quo ...
- 黄聪:JQUERY判断操作CHECKBOX选中、取消选中、反选、第二次无法选中的问题
用JQuery做CheckBox全选和反选的时候,遇到一个问题.当用JQ控制全选,全取消一次以后,再次点击全选,发现代码变了,但是CheckBox没有处于选中状态. $("#id" ...
- js中实现对checkbox选中和取消
可以使用 element.attr('checked','checked') 来进行选中.但是不能使用 element.attr('checked','false') 来取消选中. 必须通过以下方式: ...
- android checkBox选中与取消
checkView.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { // TODO ...
- jQuery对checkbox选中和取消选中操作
最近做项目发现jQuery对checkbox的全选和非全选操作只有第一次生效,以后就不生效了,不知道是不是jQuery版本库的问题,最终找到了一个解决方案: 把原来的下面这两句: $('input') ...
- easyui Tree模拟级联勾选cascadeCheck,节点选择,父节点自动选中,节点取消,父节点自动取消选择,节点选择,所有子节点全部选择,节点取消,所有子节点全部取消勾选
最近项目中用到easyui tree,发现tree控件的cascadeCheck有些坑,不像miniui 的tree控件,级联勾选符合业务需求,所以就自己重新改写了onCheck事件,符合业务需求.网 ...
- jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等
转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...
- 知识点整理01- 引用对象被子方法赋值后不改变;CheckBox 取消选择不可用问题
1. Class 实体是引用类型,但传入方法时是null的情况在子方法中不论怎么赋值当 FirstService.SetPerson(person,ref tempMsg); 执行后Person都是n ...
- checkbox全选,反选,取消选择 jquery
checkbox全选,反选,取消选择 jquery. //checkbox全部选择 $(":checkbox[name='osfipin']").each(function(){ ...
随机推荐
- python 的 from import 机制
[A.py] from B import D class C:pass [B.py] from A import C class D:pass 为什么执行A的时候不能加载D呢? 如果将A.py改为:i ...
- [问题2014A02] 解答三(降阶公式法)
[问题2014A02] 解答三(降阶公式法) 将矩阵 \(A\) 写成如下形式: \[A=\begin{pmatrix} -2a_1 & 0 & \cdots & 0 & ...
- Linux下Ruby开发配置
以CentOS为例 安装ruby:yum install ruby 安装ruby devel:yum install ruby-devel,这个装上以后,就可以使用gem安装第三方模块了 安装gem, ...
- 【原创】Capture CIS利用Access数据库建立封装库说明
1.在服务器端建立新空间,方便封装库以及数据库的归档存放 服务器路径:\\192.168.1.234\Share\STG_LIB,文件夹内容如下,其中Datesheet存放物料数据手册,Pcb_Lib ...
- 一键式Spring集成工具 Spring Boot
最近公司使用Spring boot进行开发,稍微了解一下,不过自我感觉把集中式配置applicate.properties搞明白,注解用过Spring MVC的boot绝对没问题的 比如拦截器:@As ...
- max-width实现图片的自适应
在自适应布局中,有时候会让图片随着宽度的变化相应的放大或者缩小,或者说让图片等比缩放,但是每个图片的大小又不一样,这个时候我们就要用到max-width这个属性了. img{ max-width:10 ...
- 深入浅出设计模式——工厂方法模式(Factory Method)
介绍在简单工厂模式中,我们提到,工厂方法模式是简单工厂模式的一个延伸,它属于Gof23中设计模式的创建型设计模式.它解决的仍然是软件设计中与创建对象有关的问题.它可以更好的处理客户的需求变化. 引入我 ...
- [Selenium] 数字显示的月份转换为英文显示
如果只需要英文的前三位字母,可以自己截取.
- [讨论] win7封装时如何直接开通局域网共享
ekincheng 发表于 2016-10-31 20:17:54 https://www.itsk.com/thread-371838-1-5.html Win7封装时不能像XP那样直接开启局域网共 ...
- Excel 2013中单元格添加下拉列表的方法
使用Excel录入数据的时候我们通常使用下拉列表来限定输入的数据,这样录入数据就很少发生错误了.Excel 2013较以前的版本发生了很大的变化,那么在Excel 2013是如何添加下拉列表的呢? 下 ...