这个是在jQuery1.6版本号之后出现的鬼东西。受影响的主要有下拉列表select与复选框checkbox。众所周知。在jQuery中能够用attr()取出节点的属性,然而对于checkbox却不是这样了,比方我要取出其是否被选中的属性checked,attr("checked")去取没有选中的复选框是undefinded的。仅仅能取出被选中复选框的属性。这个问题,导致我在一个条件推断中忙活了比較久的事件。查了一下发现,在jQuery1.6版本号之后,你取复选框有没有被选中,要用prop

举个样例还说明这个问题,例如以下代码。设置两行全然一模一样的东西,两button对一复选框进行操作,一个行内文本,用来显示Jquery的属性,唯一不同的是一个用了attr属性,一个用了prop属性:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>attr与prop</title>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
</head>
<body>
attr:
<button id="selected1"/>选中复选框 </button>
<button id="unselected1"/>不选中复选框 </button>
<input type="checkbox" id="checkBox1" />
<span id="tip1"></span><br/>
prop:
<button id="selected2"/>选中复选框 </button>
<button id="unselected2"/>不选中复选框 </button>
<input type="checkbox" id="checkBox2" />
<span id="tip2"></span><br/>
</body>
</html>
<script type="text/javascript">
$("#selected1").click(function(){
$("#checkBox1").attr("checked",true);
$("#tip1").html($("#checkBox1").attr("checked"));
});
$("#unselected1").click(function(){
$("#checkBox1").attr("checked",false);
$("#tip1").html($("#checkBox1").attr("checked"));
});
$("#selected2").click(function(){
$("#checkBox2").prop("checked",true);
$("#tip2").html($("#checkBox2").prop("checked"));
});
$("#unselected2").click(function(){
$("#checkBox2").prop("checked",false);
$("#tip2").html($("#checkBox2").prop("checked"));
});
</script>

执行效果却得到例如以下所看到的。极其令人吃惊的是,尽管相同可以改变复选框的值,使用attr方法去操作的复选框的第一行。其值一直没有改变。

不管选中还是没有选中一直是checked的状态,而第二行使用了prop,选中是true,没选中是没有选中的undefinded。这才干真正用于if条件的推断。使用attr取复选框是否被选中,放到if中,仅仅会对头两次选择有效,之后就失效了。因此,以后再jQuery搞复选框,没什么事还是用prop。

jQuery你丫为何各个版本号的代码会不同呢?为何不能像Javascript一样,能取就能改呢?

【jQuery】对于复选框操作的attr与prop的更多相关文章

  1. 【jQuery】复选框的全选、反选,推断哪些复选框被选中

    本文与<[JavaScript]复选框的全选.反选.推断哪些复选框被选中>(点击打开链接)为姊妹篇,把里面内容再与jQuery框架中实现一次,相同做到例如以下的效果: 布局还是相同的布局, ...

  2. 一天搞定jQuery(三)——使用jQuery完成复选框的全选和全不选

    还记得之前我使用JavaScript来实现复选框的全选和全不选效果吗?如果读者初次翻阅本文,可记得看看教你一天玩转JavaScript(七)——使用JavaScript完成复选框的全选和全不选的效果! ...

  3. jQuery取复选框值、下拉列表里面的属性值、取单选按钮的属性值、全选按钮、JSON存储、*去空格

    1.jquery取复选框的值<!--引入jquery包--> <script src="../jquery-1.11.2.min.js"></scri ...

  4. jQuery判断复选框checkbox的选中状态

    通过jQuery设置复选框为选中状态 复选框 <input type="checkbox"/> 错误代码: $("input").attr(&quo ...

  5. jquery实现复选框全选,全不选,反选中的问题

    今天试了一下用jquery选择复选框,本来以为很简单的东西却有bug,于是搜索了一下找到了解决方法. html代码如下(这里没有用任何样式,就没有再放css了): <html> <h ...

  6. jQuery实现复选框的全选、反选、并且根据复选框的<checked属性>控制多个对应div的显示/隐藏

    <!doctype html><html> <head> <meta charset="utf-8"> <title>j ...

  7. jquery判断复选框checkbox是否被选中

    jquery判断复选框checkbox是否被选中 使用is方法 //如果选中返回true //如果未选中返回false .is(':checked');

  8. jquery判断复选框是否选中

    jquery判断复选框是否被选中 $(function(){ $(document).on("click", ".checkbox",function(){ v ...

  9. python之tkinter使用-复选框操作

    # tkinter复选框操作 import tkinter as tk root = tk.Tk() root.title('问卷调查') root.geometry('220x80') # 设置窗口 ...

随机推荐

  1. iOS10 推送通知 UserNotifications

    简介 新框架 获取权限 获取用户设置 注册APNS,获取deviceToken 本地推送流程 远程推送流程 通知策略(Category+Action) 附件通知 代理回调 简介 iOS10新增了Use ...

  2. 名词解释 —— 抄送(cc)、银弹(silver bullet)

    抄送(Carbon Copy,carbon copy 本身的含义是复写本,副本),又简称为 CC. 在现代汉语中,含有抄写与送达的双重意思. 在网络术语中,抄送就是将邮件同时发送给收信人以外的人, 用 ...

  3. [SCOI 2003] 字符串折叠

    [题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=1090 [算法] 区间DP [代码] #include<bits/stdc++. ...

  4. solaris&nbsp;10&nbsp;关闭ftp、telnet

    安装solaris10,启动后发现找不到ftp.telnet的关闭方法, 管理命令 svcadm(服务状态管理,启动.停止等) # svcs 查看当前所有的服务状态,可以使用|管道符重定向作更个性化的 ...

  5. 由于管理员设置的策略,该磁盘处于脱机状态"解决办法

    .运行:cmd .输入:DISKPART.exe .DISKPART> san .DISKPART> san policy=onlineall .DISKPART>list disk ...

  6. cloudfoundry-----------service servicebroker 转载

    目前,CloudFoundry已经集成了很多第三方的中间件服务,并且提供了用户添加自定义服务的接口.随着Cloud Foundry的发展,开发者势必会将更多的服务集成进Cloud Foundry,以供 ...

  7. WebDav协议基于HTTP 1

    首先第一篇提供配置WebDav的方式 网上找了两篇比较好的配置方式分别适用于Win7 Win2003,而且都经过测试配置可以正常使用 原文中保留了引用地址,这个纯属为了要尊重别人的劳动成果 在第二篇中 ...

  8. 从实现HTML页面局部刷新到JSONP

    也可以用iframe方法发get请求,但是目前iframe基本已经被弃用,所以此处就不介绍这个方法. 方案一:用图片造 get 请求 button.addEventListener('click', ...

  9. ubuntu 16.04 php5 环境搭建

    Ubuntu 16.04默认安装php7.0环境,但是php7目前兼容性并不是很好,如果自行安装php5需要清除php7的已安装包,否则会报错. 移除默认及已安装的PHP包 sudo dpkg -l ...

  10. 【Python3】POP3协议收邮件

    初学Python3,做一个email的例子,虽然知道做的很渣渣,还是分享一下吧 POP3协议 POP3全称Post Official Protocol3,即邮局协议的第三个版本,它规定了怎样将个人计算 ...