功能如下:
1.checkbox全選/取消
2.送出表單時(submit)判斷checkbox是否選取
瀏覽器支援：
- Google Chrome
- IE9
完整程式碼
<!doctype html>
<head>
<title>列表</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<form action="delete.php" id="pform" method="post">
<label>
<input type="checkbox" name="checkbox1[]" value="61" />
1 REVERSE </label><br>
<label>
<input type="checkbox" name="checkbox1[]" value="62" />
2 ISNULL </label><br>
<p>
<input type="checkbox" id="select_all" name="select_all" onclick="check_all(this,'checkbox1[]')" />
<label for="select_all">全選/取消</label>
<input type="submit" name="delete" id="delete" value="批次刪除" />
</p>
</form>
<script language="javascript">
//檢查checkbox是否選取(至少一個)
$(document).ready(function() {
$('#delete').click(function() {
//http://kinomelma.pixnet.net/ jwu
var atLeastOneIsChecked = $('input[name="checkbox1[]"]:checked').length > 0;
if (atLeastOneIsChecked<=0){
alert("沒有選取");
return false;
}
});
});
//全選checkbox
function check_all(obj,cName)
{
var checkboxs = document.getElementsByName(cName);
for(var i=0;i<checkboxs.length;i++){checkboxs[i].checked = obj.checked;}
}
</script>
</body>
</html>
關鍵字
Only submit if at least one checkbox is checked
Only submit if a checkbox is checked
html form - Simple JavaScript Checkbox Validation
留言列表
