为什么会有bug 点击无效果不管用求解救~~~

忧桑的小猿猿 2015-10-17 04:33:05

<!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>Untitled Document</title>

<script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
</head>
<body>
<form method="post" action="">
请选择您的爱好!
<br><input type="checkbox" id="checkedAll_2"/>全选/全不选
<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>

<script language="JavaScript">

$().ready(function(){

//<input type="button" id="CheckedRev" value="反　选"/>
// TODO ？？？？？？？？ BUG
$("#CheckedRev").click(function(){
$("input[name='items']").each(function(index,domEle){
if($(this).attr("checked")){
$(this).attr("checked",null);
}else{
$(this).attr("checked","checked");
}
});
});

//<input type="checkbox" id="checkedAll_2"/>全选/全不选
// TODO ？？？？？？？？ BUG
$("#checkedAll_2").click(function(){
$("input[name='items']").attr("checked",$("#checkedAll_2").attr("checked"));
});
});

</script>
</html>

...全文

71 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

天际的海浪 2015-10-17

打赏
举报

引用 3 楼 qq_28139371 的回复:

没报错可是就是我那种方法为什么不出效果呢？

Attributes vs. Properties attributes和properties之间的差异在特定情况下是很重要。jQuery 1.6之前，.attr()方法在取某些 attribute 的值时，会返回 property 的值，这就导致了结果的不一致。从 jQuery 1.6 开始， .prop()方法方法返回 property 的值,而 .attr() 方法返回 attributes 的值。例如, selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, 和 defaultSelected 应使用.prop()方法进行取值或赋值。在jQuery1.6之前，这些属性使用.attr()方法取得，但是这并不是元素的attr属性。他们没有相应的属性（attributes），只有特性(property)。例如，考虑一个DOM元素的HTML标记中定义的<input type="checkbox" checked="checked" /> ，并假设它是一个JavaScript变量命名的elem ： elem.checked true (Boolean) 将随着复选框状态的改变而改变 $(elem).prop("checked") true (Boolean) 将随着复选框状态的改变而改变 elem.getAttribute("checked") "checked" (String) 复选框的初始状态;不会改变 $(elem).attr("checked") (1.6) "checked" (String) 复选框的初始状态;不会改变 $(elem).attr("checked") (1.6.1+) "checked" (String) 将随着复选框状态的改变而改变 $(elem).attr("checked") (pre-1.6) true (Boolean) 将随着复选框状态的改变而改变根据W3C的表单规范，在checked属性是一个布尔属性，这意味着,如果这个属性（attribute）是目前存在，即使，该属性没有对应的值，或者被设置为空字符串值，或甚至是"false"，相应的属性（property）为true。这才是真正的所有布尔属性（attributes）。然而，要记住的最重要的概念是checked特性（attribute）不是对应它checked属性（property）。特性（attribute）实际对应的是defaultChecked属性（property），而且仅用于设置复选框最初的值。checked特性（attribute）值不会因为复选框的状态而改变，而checked属性（property）会因为复选框的状态而改变。因此，跨浏览器兼容的方法来确定一个复选框是否被选中，是使用该属性（property）： if ( elem.checked ) if ( $(elem).prop("checked") ) if ( $(elem).is(":checked") ) 对于其他的动态属性，同样是true，比如 selected 和 value. 如果你使用jQuery 1.6 ，代码if ( $(elem).attr("checked") )，将获得一个属性(attribute) ，它不改变该复选框被选中和选中。它只是用来存储默认或选中属性的初始值。为了保持向后兼容，.attr() 方法从 jQuery 1.6.1+ 开始除了返回属性值外，还会更新 property 属性，因此 boolean attribute（布尔属性）不需要通过 .prop() 来改变其值。推荐使用上述方法之一，来取得 checked 的值。要想知道在最新的 jQuery 版本中,它们是如何工作的，请点击下例中的 check。

忧桑的小猿猿 2015-10-17

打赏
举报

没报错可是就是我那种方法为什么不出效果呢？

slwsss 2015-10-17

打赏
举报

$(function(){ //<input type="button" id="CheckedRev" value="反　选"/> // TODO ？？？？？？？？ BUG $("#CheckedRev").click(function(){ $("input[name='items']").each(function(index,domEle){ this.checked=!this.checked; }); }); //<input type="checkbox" id="checkedAll_2"/>全选/全不选 // TODO ？？？？？？？？ BUG $("#checkedAll_2").click(function(){ $("input[name='items']").prop("checked",this.checked); }); });