Question

我有以下代码无效。我希望你能帮助我。

基本上我有一个表单，我想在提交之前首先使用jQuery Dialog进行确认。所以，当我点击提交时，我会得到对话框但是当我按下确认没有任何反应时!!

    $(function() {

        $('#massform').submit(function(e){
           e.preventDefault();
           $('#dialog-mass-confirm').dialog('open');
        });


        $( "#dialog-mass-confirm" ).dialog({
            autoOpen: false,
            resizable: false,
            draggable: false,
            height:180,
            modal: true,
            buttons: {
                "No": function() {
                    $( this ).dialog( "close" );
                },
                "Yes": function() {
                    $("#massform").submit();
                }
            }
        });
    });

<form id="massform" method="post" action="new.php">
    <input type="text" name="email" size="41">
    <input type="submit" value="Submit">
</form>

Answer 1

看起来你可能有一个循环引用，因为你正在重新绑定表单的提交函数，然后从模态调用提交，这将触发首先打开模态的同一事件。我建议以下内容以避免此问题：

$(function() {

    $('#submitButton').click(function(e){
       e.preventDefault();
       $('#dialog-mass-confirm').dialog('open');
    });


    $( "#dialog-mass-confirm").dialog({
        autoOpen: false,
        resizable: false,
        draggable: false,
        height:180,
        modal: true,
        buttons: {
            "No": function() {
                $( this ).dialog( "close" );
            },
            "Yes": function() {
                $("#massform").submit();
            }
        }
    });
});

<form id="massform" method="post" action="new.php">
    <input type="text" name="email" size="41">
    <input ID="submitButton" type="button" value="Submit">
</form>

Answer 2

您可以更详细地查看范围和事件，以便了解您所面临的问题。 1.st您已经创建了一个jqery函数，该函数绑定到表单提交事件。

   $('#massform').submit(function(e){
           e.preventDefault();
           $('#dialog-mass-confirm').dialog('open');
        });

当您使用提交按钮时，您的事件将被触发，对话框将打开。但是，当您使用

提交表单时

            "Yes": function() {
            $("#massform").submit();

它触发前面指出的绑定函数...这会阻止自己提交的表单。准确地说，您只需重新打开对话框即可。但这种情况发生的速度太快，以至于你没有注意到它。

如果由于兼容性原因而被迫使用提交操作......您可以使用loc变量来执行脏工作...

$('#massform').submit(function(e, lock){
   if(lock)
   e.preventDefault();
   $('#dialog-mass-confirm').dialog('open');
});

虽然您可以在提交中设置锁定。从来没有尝试过，但它应该工作。我通常最终使用文档就绪范围中的变量。

当您无法修改表单时，这是脏解决方案。丑陋但有效。

jQuery提交表单

2 个答案: