Question

我不知道为什么这不起作用，即使警报功能不起作用。任何人都可以找出这里的错误。这是我的javascript：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
$('.subject').each(function() { 
alert('ok');
if($(this).find('input[type=checkbox]:checked').length == 0) { 
alert('not selected!'); 
} 
else{ 
alert('selected!'); 
} 
}); 
</script>

<form  name="f1">
<tr>
<td>
<p style="color:#999; font-size:14px; text-align:right; margin:0px;">Please select Your Medium :</p>
</td>
<td class="subject">
<input type="checkbox" name="subject[]"  value="hindi">Hindi
<input type="checkbox" name="subject[]"  value="english">English
<input type="checkbox" name="subject[]"  value="regional">Regional Language
</td>
</tr><!--end of select medium-->
<input type="submit" name="land" class="butt" value="SUBMIT"/>
</form>

Answer 1

将现有代码包装在document.ready wrapper：

中

<script type="text/javascript">
$(document).ready(){
    $('.subject').each(function() { 
        alert('ok');
        if($(this).find('input[type=checkbox]:checked').length == 0) { 
            alert('not selected!'); 
        }else{ 
            alert('selected!'); 
        } 
    }); 
});
</script>

计算机速度很快 - 如此之快，以至于您的代码会在下载后立即执行。如果它在DOM完全构建之前下载，它可能会尝试访问尚未构建的元素 - 并且失败。

解决方案：document.ready包装器，它告诉代码在运行之前等待DOM构建。一个常见的错误，我自己做了几十次。

这是一个代码验证的简单示例。

http://jsfiddle.net/W4g4e/7/

首先，使用fieldName：fieldID对创建一个关联数组。

然后，遍历所有字段ID并检查是否有效。如果没有，请使用人性化的字段名称显示错误消息（1），并在fieldID上显示（2）focus()。

Answer 2

你真的想在文档加载时运行它吗？

heres an example where its run when you click the submit button

$('.butt').on('click', function () {
    $('input[type="checkbox"]').each(function (k, val) {
        if ($(val).is(':checked')) {
            console.log('this is checked:', val);
        } else {
            console.log('this is not checked:', val);
        }
    });
});

如果你想在文档准备就绪时运行它，就像这样：

$(function () {
    $('input[type="checkbox"]').each(function (k, val) {
        if ($(val).is(':checked')) {
            console.log('this is checked:', val);
        } else {
            console.log('this is not checked:', val);
        }
    });
});

我使用的是console.log而不是alert，但你可以用alert替换console.log。

如果您不想使用提醒，请使用this：

$(function () {
    $('input[type="checkbox"]').each(function (k, val) {
        if ($(val).is(':checked')) {
            alert('this is checked:');
        } else {
            alert('this is not checked:');
        }
    });
});

我的表单中的复选框验证

2 个答案: