检查框验证在JavaScript
我写了这个剧本:检查框验证在JavaScript
function getDays(select){
var selectedString = select.options[select.selectedIndex].value;
if(selectedString == 4)
{
document.getElementById("days_target").style.display = "block";
}else {
document.getElementById("days_target").style.display = "none";
}
}
和validateForm()
功能我有这样的:
var x=document.forms["form1"]["days"].value;
if (x==null || x=="" || x=="Select Days")
{
alert("Oh, you forgot to select days! :)");
return false;
}
var x=document.forms["form1"]["days"].value;
if(x=="4")
{
var cnt = 0;
for (var i = 7; i < document.day.elements.length; i++) {
if (document.day.elements[i].type == 'checkbox') {
if (document.day.elements[i].checked == true) {
cnt++;
}
}
}
if (cnt == 0) {
alert("Atleast 1 day Should be Selected.");
return false;
}
}
HTML这样的:
<b>Please enter days required</b><br/>
<select name="days" id="days" style="width:200px;" onchange="getDays(this)">
<option value="Select Days" selected>Select Days</option>
<option value="1">Mon-Fri</option>
<option value="2">Mon-Fri</option>
<option value="3">Mon-Fri</option>
<option value="4">Bespoke Days</option>
</select><br/><br/>
<div id="days_target" style="display:none;">
<b>Select Days</b><br/>
<input type="checkbox" name="day" value="mon"/>Mon <input type="checkbox" name="day" value="tue"/>Tue<br/>
<input type="checkbox" name="day" value="wed"/>Wed <input type="checkbox" name="day" value="thr"/>Thr<br/>
<input type="checkbox" name="day" value="fri"/>Fri <input type="checkbox" name="day" value="sat"/>Sat<br/>
<input type="checkbox" name="day" value="sun"/>Sun<br/><br/>
</div>
如果我选择定制日期然后复选框出现,如果没有被检查,然后我想显示错误消息“至少有一天应该被选中“。这个怎么做?
函数在jQuery中可以让你轻松做到这一点。这将需要两个步骤。通过把这个你的头标记内的HTML
-
负载jQuery的(
<head></head>
):<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
-
添加JavaScript在验证时,条件不满足:
$('#days').after('<label class="error">Atleast one day should be selected.</label.');
此外,您将希望错误消息在验证规则满足时消失。
$('.error').remove();
你可能会想调整显示的目的,HTML/CSS,但应该足以让你去。
您正在访问复选框的方式不正确。表单具有元素。你也从7开始,从0而不是计数和或6计数和倒计时
var day = document.forms["form1"].day;
for (var i = 0; i < day.length; i++) {
if (day[i].type == 'checkbox') {
if (day[i].checked == true) {
cnt++;
}
}
}
我会做这样的:
var x=document.forms["form1"]["days"].selectedIndex;
if (x<1) {
alert("Please select days");
return false;
}
else if(x==4) { // fifth entry
var checked = false, chk = document.forms["form1"]["day"];
for (var i = 0; i < chk.length; i++) {
if (chk[i].checked) { checked=true; break }
}
if (!checked) {
alert("At least one day should be checked.");
return false;
}
}
它不工作..在检查所有复选框后,它会给出错误信息。 – 2013-05-06 13:34:42
请再试一次,我忘了[i] – mplungjan 2013-05-07 04:31:13
值不能为空 – epascarello 2013-05-06 12:52:20