jQuery实现全选框要注意的地方

最新推荐文章于 2022-02-15 14:20:56 发布

Z_Y_Jerry

最新推荐文章于 2022-02-15 14:20:56 发布

阅读量483

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/jerryzdg/article/details/81878803

版权

在阅读《锋利的jQuery》时，发现书中关于复选框全选功能的代码存在bug。问题在于全选按钮在页面刷新后仅第一次点击有效。经研究发现，jQuery 1.6引入的prop()方法用于处理属性值，而attr()方法用于设置或返回属性值。prop()适用于处理布尔属性，如checked。因此，修复bug的方法是将attr()替换为prop()。

摘要由CSDN通过智能技术生成

最近在看《锋利的jQuery》，对前端感兴趣的同学可以看一看这本书，PDF版很容易找，也可以留言让我发给你们。

今天看到第五章对表单、表格的操作以及更多应用，发现其中复选框应用该小节的例子有bug。在运行该例子的时候，我多点了几下，发现全选按钮只有在每次刷新后第一次点击生效，在刷新前再点都不起作用。话不多说，上代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>复选框应用</title>
	</head>
	<body>
		<form action="#" method="post">
			您爱好的运动是<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="checkall" value="全选"