jquery input checked全选与反选1.3.2的版本

最新推荐文章于 2025-08-09 20:51:19 发布

转载最新推荐文章于 2025-08-09 20:51:19 发布 · 78 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://yq.aliyun.com/articles/387825

文章标签：

#javascript #xhtml #ViewUI

本文介绍了一个简单的jQuery插件，用于实现网页表单中复选框的全选与反选功能。通过点击按钮即可切换所有复选框的状态，并且支持1.3.2版本的jQuery库。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<title>jquery input checked全选与反选1.3.2的版本</title> 

<script language="javascript" type="text/javascript" 

src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script> 
 
<script language="javascript" type="text/javascript"> 
$.fn.checkCbx = function(){ 
return this.each(function(){ this.checked = !this.checked; });
} 
 
$(function(){ 
$("#btnSelect").click(function(){ 

 this.value = this.value == "全选"?"反选":"全选"; 
$("input:checkbox").checkCbx(); 
}) 
}) 

</script> 

</head> 

<body> 

<form >

<table border="1"> 

<tr> 

<th>选择</th> 

<th>id</th> 

<th>姓名</th> 

</tr> 

<tr> 

<td><input type="checkbox" name="cbx" /></td> 

<td>1</td> 

<td>学无止境</td> 

</tr> 

<tr> 

<td><input type="checkbox" name="cbx" /></td> 

<td>2</td> 

<td>csdn</td> 

</tr> 

<tr> 

<td><input type="checkbox" name="cbx" /></td> 

<td>3</td> 

<td>曾祥展</td> 

</tr> 
 
</table> 

<input id="btnSelect" type="button" value="全选" /> 

</form> 
 
</body>

</html>