jquery 全选反选全不选

代码如下:

<table border="1" cellspacing="0" style="text-align: center;">
	<tr>
		<th>
			<input type="button" value="全选" onclick="quan()" id="quan" style="width: 70px;">
			<input type="hidden" value="全不选" onclick="no()" id="noq" style="width: 70px;">
			<input type="button" value="反选" onclick="fan()" style="width: 70px;">
		</th>
	</tr>
	<tr>
		<td>
			<input type="checkbox" >    <!--复选框-->
		</td>
	</tr>
</table>

<script type="text/javascript">
	function quan(){
		var arr=$("input:checkbox");
		arr.each(function(){
			$(this).prop("checked",true);
		})
		$("#quan").prop("type","hidden");
		$("#noq").prop("type","button");
	}
	function fan(){
		var arr=$("input:checkbox");
		arr.each(function(){
			var b=$(this).prop("checked");
			$(this).prop("checked",!b);
		})
	}
	function no(){
		var arr=$("input:checkbox");
		arr.each(function(){
			$(this).prop("checked",false);
		})
		$("#quan").prop("type","button");
		$("#noq").prop("type","hidden");
	}
	
	
</script>

效果如下：

---

点击全选按钮 全选按钮消失 全不选按钮显示：

---

点击全不选按钮 全不选按钮消失 全选按钮显示：

---

点击反选之前：

点击之后：