Question

我在页面上有一个表单，但是没有提交。有一个链接使用colorbox插件启动了模式对话框。提交按钮实际上在该对话框中。为了让我提交表单，我使用delegate（）因为提交按钮没有添加到DOM，直到模式启动。

我添加了一个必须在提交表单之前检查的复选框，但我认为我遗漏了一些东西，因为无论是否检查都无法提交。

这是我的代码

JS

$('#openModal').colorbox({ 
    html: 'some text <input type="checkbox" name="chk" id="chk"><input id="mySubmit" type="button" value="submit form">' 
});

$('#mySubmit').click(function() {

    if ($('#chk').is(':checked')) {
        $('#myForm').submit();
    } else {
        alert('Must check first...');
    }
});

HTML

    <div id="openModal">open modal</div>

</form>

我错过了什么？

更新：遗失了身份证......哇。感谢@McMaster抓住它。添加了ID ...

Answer 1

在这种情况下，您似乎没有委托点击事件。

试试这个

$('body').delegate('click' ,'#mySubmit' ,function() {

    if ($('#chk').is(':checked')) {
        $('#myForm').submit();
    } else {
        alert('Must check first...');
    }
});

Answer 2

您正在动态添加颜色框中使用的input元素。请注意从name到id的更改。

$('#openModal').colorbox({
    html: '<input type="checkbox" id="chk" /><input id="mySubmit" type="button" value="...">';
});

因此，您应该使用on。

$('#mySubmit').on("click", function() {
    if ($('#chk').is(':checked')) {
        $('#myForm').submit();
    } else {
        alert('Must check first...');
    }
});

从模态提交之前检查选项

2 个答案: