HTML中input标签有两个类型,radio和checkbox,一个单选按钮一个复选按钮。jquery可以通过$(":radio")和$(":checkbox")选择到它们,如果要选择的是被选中的按钮,jquery可以通过$(:checked)的选中它。

Jquery判断checked的三种方法(转载内容):


.attr(‘checked’):   //看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false
.prop(‘checked’): //16+:true/false
.is(‘:checked’):    //所有版本:true/false//别忘记冒号哦

jquery赋值checked的几种写法:

所有的jquery版本都可以这样赋值:

// $(“#cb1″).attr(“checked”,”checked”);
// $(“#cb1″).attr(“checked”,true);

jquery1.6+:prop的4种赋值:

// $(“#cb1″).prop(“checked”,true);//很简单就不说了哦
// $(“#cb1″).prop({checked:true}); //map键值对
// $(“#cb1″).prop(“checked”,function(){
return true;//函数返回true或false
});

//记得还有这种哦:$(“#cb1″).prop(“checked”,”checked”);


问题: 多选反选

如何通过上面提到的选择器来完成多选与反选的功能。首先单选和复选按钮可以通过click()事件触发,也可以change()事件触发。

改变按钮选中与被选中的状态方法有下面几种:

Jquer方法

attr()方法和prop()方法(转载内容)

在做复选框全选按钮的时候,出现了一个问题,使用语句$.attr('checked',true),将复选框的属性改为被选中,在chrome浏览器中第一次点击有效后面就不行了,IE8倒是没有问题。

百度了很久找到原因是HTML的属性分为attribute和property,暂且将后者称为特性。

checked属性即分为attribute->checked,和property->true,false。

对于一个checkbox,若未定义checked="checked",alert($.attr("checked")) 的结果是undefined。若已定义则结果是checked。attribute并不随着checkbox的状态变化而改变。

使用prop($.attr("checked"))的话输出则分别为false和true。property则随其变化而变化。

所以在修改checked属性时要使用prop()。prop()在jQuery1.6版本后新增。


下面是属性修改方法推荐使用表

Javascript方法

checkboxObject.checked=true|false


下面为实现单选与反选功能的简单代码

 <html>

     <head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
</head> <body>
<div class="checkBox">
<input type="checkbox" name="test" />选择一
<input type="checkbox" name="test" />选择二
<input type="checkbox" name="test" />选择三
</div>
<button class="all">全选</button>
<button class="other">其它</button>
<script type="text/javascript">
$(".all").click(function() {
$(".checkBox input").prop("checked", true);
});
$(".other").click(function() {
$(".checkBox input").each(function() {
this.checked = !this.checked;
});
});
</script>
</body> </html>

工作案件1 一切都是有check引起的的更多相关文章

  1. 工作五年以上的 UI 设计师都在干什么?

    30 岁,现在坐标北京,从毕业至今都一直在做设计.目前从业超过了五年,也没打算离开设计这个行业.即便有一天不再从事设计专职的岗位,也仍然会在生活中,或者一些份外的工作中做「设计师」的角色,因为设计已成 ...

  2. ABP(现代ASP.NET样板开发框架)系列之12、ABP领域层——工作单元(Unit Of work)

    点这里进入ABP系列文章总目录 基于DDD的现代ASP.NET开发框架--ABP系列之12.ABP领域层——工作单元(Unit Of work) ABP是“ASP.NET Boilerplate Pr ...

  3. 工作中那些提高你效率的神器(第二篇)_Listary

    引言 无论是工作还是科研,我们都希望工作既快又好,然而大多数时候却迷失在繁杂的重复劳动中,久久无法摆脱繁杂的事情. 你是不是曾有这样一种想法:如果我有哆啦A梦的口袋,只要拿出神奇道具就可解当下棘手的问 ...

  4. 工作中那些提高你效率的神器(第一篇)_Everything

    引言 无论是工作还是科研,我们都希望工作既快又好,然而大多数时候却迷失在繁杂的重复劳动中,久久无法摆脱繁杂的事情. 你是不是曾有这样一种想法:如果我有哆啦A梦的口袋,只要拿出神奇道具就可解当下棘手的问 ...

  5. FTPClient使用中的问题--获取当前工作目录为null

    使用org.apache.commons.net.ftp.FTPClient 来做ftp的上传下载功能 FTPClient ftp = new FTPClient();ftp.connect(doc. ...

  6. 解析ABP框架中的事务处理和工作单元,ABP事务处理

    通用连接和事务管理方法连接和事务管理是使用数据库的应用程序最重要的概念之一.当你开启一个数据库连接,什么时候开始事务,如何释放连接...诸如此类的. 正如大家都知道的,.Net使用连接池(connec ...

  7. IT行业工作6年回顾

    IT行业工作6年回顾 时间一晃,已经出来工作六七年了,当真岁月如梭,时光如箭,回首往昔,当真叹一句:“太多东西都失于路上”,今天偷得浮生半日闲,做个回顾,权当是给自己做个小结,也希望给他人一些可用的借 ...

  8. ASP.NET页面与IIS底层交互和工作原理详解

    转载自:http://www.cnblogs.com/lidabo/archive/2012/03/13/2393200.html 第一回: 引言 我查阅过不少Asp.Net的书籍,发现大多数作者都是 ...

  9. ASP.NET页面与IIS底层交互和工作原理详解(第三回)

    引言 Http 请求处理流程 和 Http Handler 介绍 这两篇文章里,我们首先了解了Http请求在服务器端的处理流程,随后我们知道Http请求最终会由实现了IHttpHandler接口的类进 ...

随机推荐

  1. LeetCode40 Combination Sum II

    题目: Given a collection of candidate numbers (C) and a target number (T), find all unique combination ...

  2. tachyon with hadoop

    hadoop2.2.0 jdk1.7 tachyon0.5.0 无zookeeper tachyon和hadoop都是伪分布式模式 1.修改core-site.xml文件 <property&g ...

  3. docker 容器数据管理

    给容器添加一个数据卷 sudo docker run -d -P --name web -v /webapp training/webapp python app.py 可以在Dockerfile中使 ...

  4. Entity Framework之问题收集

    本节讨论内容主要针对收集了上篇文章大家碰到问题的讨论解决,会持续收集扩充. DbContext加载原值,当前值,数据库值,属性操作,对象复制,对象值复制(VO,DTO->POCO),复杂对象取值 ...

  5. 如何利用log4Net自定义属性配置功能记录完整的日志信息

    log4Net作为专业的log记录控件,对于它的强大功能大家一定不陌生.下面我将详细介绍如何利用其自定义属性,让日志信息更完整. 一,创建测试工程,log4Net组件可以自己从网上下载,也可通过Nug ...

  6. soupUI生成webservice客户端代码

    在Apache网站下载axis2软件包,同时本机安装soapUI工具.例如,当前我使用的axis2版本为axis2-1.4-bin.zip,soapUI版本为3.6. Apache Axis下载地址: ...

  7. SQL中VARCHAR与NVARCHAR存储区别

    DATALENGTH 与LEN的查询区别 插入结果 总结:DATALENGTH计算字节长度,LEN计算字符串长度 VARCHAR(2)是指允许存取字节长度小于或等于2的字符串          NVA ...

  8. Android(java)学习笔记66:实现Runnable接口创建线程 和 使用Callable和Future创建线程

    1. 前面说的线程的实现是新写一个子类继承Thread: 是将类声明为 Thread 的子类.该子类应重写 Thread 类的 run 方法.接下来可以分配并启动该子类的实例 2. 这里说的方案2是指 ...

  9. IOS开发篇UI之重用scrollView

    1.scrollView的介绍 scrollView是UI中的基础视图,他有着至关重要的作用,也是我们在UI中常用的控件.他的代理有很多我们需要用,这里我们就不再一一介绍了. 2.简单scrollVi ...

  10. 【前端JS、后台C#】编码解码。

    最近做项目,出现中文乱码的问题,特地研究一下. GB2312,指的是中文 UTF8,指的是国标,包含中文.英文. 但是通过JQuery.ajax的Get.Post,如果直接传递中文或者特殊字符的特使字 ...