今天用jQuery学习表单这一章节的内容,再次遇到表单全选时,不能进行第二次全选的情况。反复查看测试仍然找不到是什么原因。后来在网上查到原来是jQuery1.6以后的版本用到的是prop。用attr的话不会多次实现,因为attr不会记录当前checkbox的选中状态。

表单这一章节内容让我感觉到有点吃力,总之好好努力吧!

以下是代码说明:


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>复选框</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js" ></script>
<script type="text/javascript">
$(function(){
//使用attr
/*$("#CheckedAll").click(function(){
if(this.checked){
$('[name=items]:checkbox').attr('checked',false);
} else {
$('[name=items]:checkbox').attr('checked',true);
}
});*/
//使用prop
$("#CheckedAll").click(function(){
if(this.checked){
$('[name=items]:checkbox').prop('checked',false);
} else {
$('[name=items]:checkbox').prop('checked',true);
}
});*/ });
</script>
</head>
<body>
<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="CheckedAll" value="全 选">
<input type="button" id="CheckedNo" value="全部选">
<input type="button" id="CheckedRev" value="反 选">
<input type="button" id="send" value="提 交">
</form>
</body>
</html>

有关与attribute和property的区分可参考:http://www.tuicool.com/articles/3uuQRr6

关于jQuery表单选择中prop和attr的区别。的更多相关文章

  1. jquery中prop和attr的区别

    jquery中prop和attr的区别 prop: prop(name|properties|key,value|fn) **概述** 获取在匹配的元素集中的第一个元素的属性值. 随着一些内置属性的D ...

  2. 表单提交中get与post的区别

    在Form里面,可以使用post也可以使用get.它们都是method的合法取值. 1. get是从服务器上获取数据,post是向服务器传送数据.   2. get是把参数数据队列加到提交表单的ACT ...

  3. Jquery 获取Checkbox值,prop 和 attr 函数区别

    总结: 版本 1.6 1.6 1.4 1.4 函数 勾选 取消勾选 勾选 取消勾选 attr('checked') checked undefined true false .prop('checke ...

  4. jquery中prop()和attr()的区别

    相比attr,prop是1.6.1才新出来的,两者从中文意思理解,都是获取/设置属性的方法(attributes和properties).只是,window或document中使用.attr()方法在 ...

  5. 第82天:jQuery中prop()和attr()的区别

    在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答案很多.这里谈谈我的心得,我的心得很简单: ...

  6. jq中.prop()与attr()的区别

    一,定义 prop() 方法设置或返回被选元素的属性和值.prop() 方法应该用于检索属性值 attr()  方法设置或返回被选元素的属性和值.如需检索 HTML 属性,请使用 attr() 方法代 ...

  7. jq中prop和attr的区别以及各自的使用

    在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答案很多.这里谈谈我的心得,我的心得很简单: ...

  8. jQ中prop与attr的区别

    1.prop适用于HTML元素本身就带有的固有属性 2.attr适用于HTML元素我们自定义的属性 <input type="checkbox" value="复选 ...

  9. python_way day17 jQuery表单验证,事件绑定,插件,文本框架,正则表达式

    python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...

随机推荐

  1. 【CSS/JS学习】如何实现单行/多行文本溢出的省略(...)--老司机绕过坑道的正确姿势

    引言: 写前端UI的朋友们也许都遇到过这样的问题:我们需要实现这样一个需求,在一个父级元素中隐藏一个可能过长的文本:   这个文本可能是单行的:   也可能是多行的:   下面我就给大家展示如何简单或 ...

  2. 在阿里云Linux服务器上安装MySQL

    申请阿里云Linux服务器 昨天在阿里云申请了一个免费试用5天的Linux云服务器. 操作系统:Red Hat Enterprise Linux Server 5.4 64位. CPU:1核 内存:5 ...

  3. 《Algorithms Unlocked》读书笔记1——循环和递归

    <Algorithms Unlocked>是 <算法导论>的合著者之一 Thomas H. Cormen 写的一本算法基础. 书中没有涉及编程语言,直接用文字描述算法,我用 J ...

  4. Oracle wm_concat()函数

    oracle wm_concat(column)函数使我们经常会使用到的,下面就教您如何使用oraclewm_concat(column)函数实现字段合并 如: shopping:   ------- ...

  5. android正则表达式隐藏邮箱地址中间字符

    // String emailStr = email.substring(0, email.lastIndexOf("@"));// if (emailStr.length() & ...

  6. Spring+SpringMVC+MyBatis+easyUI整合优化篇(八)代码优化整理小记及个人吐槽

    日常啰嗦 这两天也一直在纠结这一篇文章该写什么东西,前面临时加的两篇文章就有些打乱了整体节奏,这一篇又想去写一下代码层面优化的事情,可是也不太能抓住重要的点,不太确定从何入手,因为这件事情牵涉了太多技 ...

  7. ios app网址说明

    URLforBrowser = 'https://itunes.apple.com/cn/app/wan-huo-shi-shang-zhu-li-ren/id1077705***'; URLfori ...

  8. Android高效内存:让图片占用尽可能少的内存

    Android高效内存:让图片占用尽可能少的内存 一.让你的图片最小化 1.1 大图小图内存使用情况对比 大图:440 * 336    小图:220 * 168 小图的高宽都是大图的1/2--> ...

  9. OA办公系统,一个沉淀企业文化的容器

    资源是会枯竭的,唯有文化才会生生不息.一切工业产品都是人类智慧创造的.随着公司规模的扩大,企业中两大根本"人和规则"面临诸多挑战,OA办公系统是一个全员使用的办公软件产品,员工可通 ...

  10. JavaScript常用的方法和函数(setAttribute和getAttribute )

    仅记录学习的新知识和示例,无干货. 1.setAttribute和getAttribute          (Attribute:属性) setAttribute:为元素添加指定的属性,并为其赋值: ...