javascript - 使用必需的复选框验证来防止表单提交

标签 javascript validation checkbox require

我有一些代码可以检查是否至少选择了一个复选框,然后提交表单(MailChimp)。我的问题是,如果发现没有选中任何复选框,我不知道如何停止 MailChimp 提交。现在它会显示警报,然后无论如何都会提交表单......没什么帮助。

<form onsubmit="valthis()" action="//mailchimp form" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>

// form html

        <script>function valthis() {
var checkBoxes = document.getElementsByClassName( 'myCheckBox' );
var isChecked = false;
    for (var i = 0; i < checkBoxes.length; i++) {
        if ( checkBoxes[i].checked ) {
            isChecked = true;
        };
    };
    if ( isChecked ) {
        alert( 'At least one checkbox is NOT checked!' );
        }   
}</script>

<input type="submit" value="Subscribe to notifications" name="subscribe" id="mc-embedded-subscribe" class="button">

最佳答案

您需要在提交时向表单添加事件

document.getElementsByName("subscribe").onsubmit(function(event) {
    if(!isChecked) { //If not checked
        event.preventDefault(); // stops the form submitting
    }
});

如果没有选中任何复选框preventDefault 。这会阻止表单提交

关于javascript - 使用必需的复选框验证来防止表单提交,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45570334/

相关文章:

java - 如何在 swing java 的检查列表框中使用全选选项?

ruby-on-rails - rails ,复选框

javascript - 是否可以强制图像达到设定高度但仍保持响应?

javascript - 显示部分的字数统计(使用 :target selector)

angular - 如何迭代现有的 FormControl 验证器

validation - JideFX 验证器不起作用

javascript - 如何在javascript中检测复选框是否被选中

javascript - 插件可以与 downthemall 插件通信吗?

javascript - 调整 jquery 以保持幻灯片中的图像比例

ruby - 在 Ruby 中验证用户日期输入