jquery 中prop的使用以及一些要注意的问题

时间 2019-11-06

原文原文链接

近有网友提出jquery作全选和取消全选这些操做时，只能执行一遍，后面追查下去，发现了问题的根源，发现用jquery中的removeProp对checked操做是会彻底移除了元素的属性，以致于使用removeProp后再使用prop设置属性就没有效果了？？ javascript

因而查找到了官网，终于发现了 html

Do not use this method to remove native properties such as checked, disabled, or selected. This will remove the property completely and, once removed, cannot be added again to element. Use .prop() to set these properties to false instead.

这是jquery中的说明 http://api.jquery.com/removeProp/

因而html是能够这样的 java

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>prop的使用</title>
</head>
<body>
<label><input type="checkbox" name="" id="checkAllWaitlist" />全选</label>
<br />
<input type="checkbox" name="" id="" class="waitSoldOrder" />
<input type="checkbox" name="" id="" class="waitSoldOrder" />
<input type="checkbox" name="" id="" class="waitSoldOrder" />
<input type="checkbox" name="" id="" class="waitSoldOrder" />
<input type="checkbox" name="" id="" class="waitSoldOrder" />
<script type="text/javascript" src="jquery-1.10.2.js"></script>
<script type="text/javascript">
	$(function(){
		$('#checkAllWaitlist').click(function(){
			$('.waitSoldOrder').prop('checked',this.checked);
			//取消选中时不能使用 removeProp ,这样会在第二次全选的时候发现下面的不能选中，由于使用removeProp会把该属性从元素中移除 ，应该是使用prop 进行修改其状态
			//下面是jquery官网的说明   http://api.jquery.com/removeProp/
			//Do not use this method to remove native properties such as checked, disabled, or selected. This will remove the property completely and, once removed, cannot be added again to element. Use .prop() to set these properties to false instead.
		});
	});
</script>
</body>
</html>

有兴趣的能够测试一下。 jquery