jquery复选框

时间：2016-01-28 18:53:27 阅读：184 评论：0 收藏：0 [点我收藏+]

标签：

$("#frmTest :checkbox").attr("checked","true");

frmTest 为表单from的id 上面代码可以让表单中所有复选框实现全选

但是

$("#frmTest :checkbox").attr("checked","flase");却未能取消全选

正确的取消全选代码是

$("#frmTest :checkbox").prop("checked",flase);

注意flase不能加双引号

同理

$("#frmTest :checkbox").attr("checked","true");将单选框选中而

$("#frmTest :checkbox").attr("checked","flase");却未能取消选中

正确代码为

$("#frmTest :radio").prop("disabled",flase);

建议都用prop

---------别人的博客-------

最近项目又用到了这个全选和取消全选的操作.

以前总是自己写纯JS.现在既然知道怎么写了.那如何用JQ写得更简洁呢.这样也能学到新的东西.如果乎百度一下果然发现了好东东.感谢OSC的iuhoay.

代码如下:

[javascript] view plain copy

print ?

<script type="text/javascript" src="/web/bzz_index/password/js/jquery-1.7.1.min.js"></script>
<script language="JavaScript">
$(function() {
$("#ckAll").click(function() {
$("input[name=‘sub‘]").prop("checked", this.checked);
});
$("input[name=‘sub‘]").click(function() {
var $subs = $("input[name=‘sub‘]");
$("#ckAll").prop("checked" , $subs.length == $subs.filter(":checked").length ? true :false);
});
});
</script>

[html] view plain copy

print ?

<input type="checkbox" id="ckAll" />check all<br />
<input type="checkbox" name="sub" />1<br />
<input type="checkbox" name="sub"/>2<br />
<input type="checkbox" name="sub"/>3<br />
<input type="checkbox" name="sub"/>4<br />

必须说的是JQ1.6+以上才支持prop哦.关于prop可以看看下面这个.

今天在用JQuery的时候发现一个问题用.attr("checked")获取checkbox的checked属性时选中的时候可以取到值,值为"checked"但没选中获取值就是undefined.

解决这个文章我参考了这个帖子：

http://bugs.jquery.com/ticket/9812

为什么jquery 1.6+增加了.prop()方法，因为在有些浏览器中比如说只要写disabled，checked就可以了，而有的要写成disabled = "disabled"，checked="checked"。所以，从1.6开始，jq提供新的方法“prop”来获取这些属性。

以前我们使用attr获取checked属性时返回"checked"和"",现在使用prop方法获取属性则统一返回true和false。

那么，什么时候使用attr，什么时候使用prop？？

1.添加属性名称该属性就会生效应该使用prop.

2.是有true,false两个属性使用prop.

3.其他则使用attr

项目中jquery升级的时候大家要注意这点！

以下是官方建议attr(),prop()的使用：

但有以下三点，需要注意（摘自黑暗执行绪）：

$(window).attr(), $(document).attr()建议改为$(windows).prop(), $(document).prop()，因为window及document理论上无从加上HTML Attribute，虽然jQuery 1.6.1在内部会偷偷改用.prop()，毕竟语意不合逻辑，应该避免。

在HTML语法<input type=”checkbox” checked=”checked” />中，checked Attribute只会在一开始将checked Property设成true，后续的状态变更及储存都是透过checked Property。换句话说，checked Attribute只影响初值，之后应以checked Property为准。基于这个理由，$(“:checkbox”).prop(“checked”, true)会比$(“:checkbox”).attr(“checked”, true)来得合理。虽然jQuery 1.6.1已让$(“:checkbox”).attr(“checked”, true)也具有变更checked Property的能力，但prop()确实比attr()写法更吻合背后的实际运作。

适用此点的Boolean属性包含了: autofocus, autoplay, async, checked, controls, defer, disabled, hidden, loop, multiple, open, readonly, required, scoped, selected

jQuery Team提供一张DOM元素属性适用attr()/prop()的对照表:

Attribute/Property	`.attr()`	`.prop()`
accesskey	?
align	?
async	?	?
autofocus	?	?
checked	?	?
class	?
contenteditable	?
defaultValue		?
draggable	?
href	?
id	?
label	?
location *	?	?
multiple	?	?
nodeName		?
nodeType		?
readOnly	?	?
rel	?
selected	?	?
selectedIndex		?
src	?
style	?
tabindex	?
tagName		?
title	?
type	?
width **	?

jquery复选框

标签：

原文地址：http://www.cnblogs.com/yangAL/p/5167099.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行