<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery實現復選框的全選和全不選</title>
</head>
<body>
<label><input type="checkbox" name="checkall" />全選</label>
<br><br>
<label><input type="checkbox" name="checkbox" />復選框1</label>
<label><input type="checkbox" name="checkbox" />復選框2</label>
<label><input type="checkbox" name="checkbox" />復選框3</label>
<label><input type="checkbox" name="checkbox" />復選框4</label>
<label><input type="checkbox" name="checkbox" />復選框5</label>
<!-- 引入jQuery官方類庫 -->
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<!-- start 全選/全不選 -->
<script type="text/javascript">
$('input[name="checkall"]').on("click",function(){
if($(this).is(':checked')){
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",true);
});
}else{
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",false);
});
}
});
</script>
<!-- end 全選/全不選 -->
</body>
</html>
input全選和取消全選
免責聲明！
本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。