按顺序对复选框进行 Javascript 验证
[英]Javascript validation for checkbox in sequence
问题描述
首先我很抱歉我的英语不好。 我是 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>
2 个解决方案
解决方案1
1 2016-09-21 10:14:00
尝试这个 -
<script type="text/javascript" language="JavaScript">
function validate(){
var pilihan1 = document.getElementById("checkbox1").checked;
var pilihan2 = document.getElementById("checkbox2").checked;
var pilihan3 = document.getElementById("checkbox3").checked;
var pilihan4 = document.getElementById("checkbox4").checked;
var flag =0;
if(pilihan1=="") {
alert("Checkbox pertama tidak boleh kosong");
flag=0;
}
else if(pilihan2=="") {
alert("Checkbox 2");
flag=0;
}
else if(pilihan3=="") {
alert("Checkbox 3");
flag=0;
}
else if(pilihan4=="") {
alert("Checkbox 4");
flag=0;
} else {
flag=1;
}
if(flag==1){
return true;
} else {
return false;
}
</script>
解决方案2
1 已采纳 2016-09-21 10:29:41
<!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中的转义序列验证
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.