首先,我很抱歉我的英语不好。我是 Javascript 新手,遇到了一个问题。我的问题是关于使用 javascript 进行复选框验证,因此我应该检查第一个复选框或显示警报(我已经解决了这个问题,所以不再有问题),但第二个问题是应按顺序检查复选框(或顺序)对于示例,有 4 个复选框,我检查了第一个、第二个和第四个(不是按顺序/顺序),所以有一个警报,但如果我检查了第一个、第二个和第三个,那就很好。有谁知道如何使用 JavaScript 验证该条件?
这是我的代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<form action="form-si-hasil.php" method="post" onsubmit="return validate(this)" id="form" name="form">
<h1>Form Hobi</h1>
<input type="checkbox" name="ck1" value="Membaca" id="checkbox1">Membaca
<br />
<input type="checkbox" name="ck2" value="Sport" id="checkbox2">Sport
<br />
<input type="checkbox" name="ck3" value="Singing" id="checkbox3">Singing
<br />
<input type="checkbox" name="ck4" value="Dancing" id="checkbox4">Dancing
<br />
<br />
<input type="submit">
</form>
<script src="../js/jquery-1.11.2.min.js"></script>
<script type="text/javascript" language="JavaScript">
function validate(){
var pilihan1 = document.getElementById("checkbox1").checked;
if(pilihan1=="") {
alert("Checkbox pertama tidak boleh kosong");
return false
}
return true
}
</script>
</body>
</html>
最佳答案
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("input[type='checkbox']").change(function(){
var isCheck = $(this).prevAll("input").is(":checkbox");
var total = $(this).prevAll("input[type='checkbox']").length;
var checkTotal = $(this).prevAll("input[type='checkbox']:checked").length;
if(isCheck && ((total-checkTotal)>1)){
$(this).prop("checked",false);
alert("false");
}else{
alert("ture");
}
});
});
</script>
</head>
<body>
<form action="form-si-hasil.php" method="post" onsubmit="return validate(this)" id="form" name="form">
<h1>Form Hobi</h1>
<input type="checkbox" name="ck1" value="Membaca" id="checkbox1">Membaca
<br />
<input type="checkbox" name="ck2" value="Sport" id="checkbox2">Sport
<br />
<input type="checkbox" name="ck3" value="Singing" id="checkbox3">Singing
<br />
<input type="checkbox" name="ck4" value="Dancing" id="checkbox4">Dancing
<br />
<input type="checkbox" name="ck4" value="Dancing" id="checkbox4">test
<br />
<input type="checkbox" name="ck4" value="Dancing" id="checkbox4">test 1
<br />
<br />
<input type="submit">
</form>
</body>
</html>
关于Javascript 按顺序验证复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39613501/