我在一种形式中有两组单选按钮。如果您没有在每组中选中一个单选按钮,则您不应该能够发送表单。如果可能的话,我想要一个只有 JS的解决方案(没有 jQuery)。我在这里的一个较旧的问题中找到了一个有用的功能,并试图将其调整到我的情况,但我显然失败了。我的错在哪里?
<form>
<input type="radio" name="date_1" id="dat-1_27-10" value="2017-10-27" <?php echo $checked1 ;?> />
<input type="radio" name="date_1" id="dat-1_28-10" value="2017-10-28" <?php echo $checked2 ;?> />
<input type="radio" name="date_1" id="dat-1_03-11" value="2017-11-03" <?php echo $checked3 ;?> />
<input type="radio" name="date_1" id="dat-1_04-11" value="2017-11-04" <?php echo $checked4 ;?> />
<input type="radio" name="date_2" id="dat-2_27-10" value="2017-10-27" <?php echo $checked5 ;?> />
<input type="radio" name="date_2" id="dat-2_28-10" value="2017-10-28" <?php echo $checked6 ;?> />
<input type="radio" name="date_2" id="dat-2_03-11" value="2017-11-03" <?php echo $checked7 ;?> />
<input type="radio" name="date_2" id="dat-2_04-11" value="2017-11-04" <?php echo $checked8 ;?> />
<input type="submit" name="send" value="send" id="submit" onclick='return validateDateOne(); return validateDateTwo();'/>
</form>
<script>
function validateDateOne() {
if (!$("input[name='date_1']:checked").val()) {
alert('Please choose your favourite date');
return false;
}
else {}
}
function validateDateTwo() {
if (!$("input[name='date_2']:checked").val()) {
alert('Please choose a second date');
return false;
}
else {}
}
</script>
将您的支票组合在一个功能中。此外,我建议使用 jQuery 附加提交处理程序。
这是一个有效的jsfiddle
<input type="submit" name="send" value="send" id="submit" />
$('#myform').submit(function(e){
e.preventDefault();
if (!$("input[name='date_1']:checked").val()) {
alert('Please choose your favourite date');
return;
}
if (!$("input[name='date_2']:checked").val()) {
alert('Please choose a second date');
return;
}
alert("submit")
});
请注意,Jquery 提交处理程序包含在一个 onDomReady 处理程序中。
另外:客户端验证从来都不是安全的。为了确保输入数据,也在后端验证它。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句