Question

我在每个表单提交操作上都触发了jQuery BlockUI Plugin：

$("form").submit(function() {
    jQuery.blockUI();
});

我想在提交之前验证一些表单：

<form method="POST" onSubmit="return(confirm('Really submit?'));">

当我在确认弹出框中点击“取消”时，BlockUI被触发并阻止该界面。它永远不会畅通无阻这是一个例子：http://jsfiddle.net/8B8yA/。

问题是如何在按下“取消”时阻止BlockUI被触发。

我尝试将$.unblockUI()添加到“取消”操作：

if(!confirm("Really submit?")) {
    $.unblockUI();
    return(false);
}

但它显然不起作用，因为在阻止操作之前调用了取消阻止操作。

Answer 1

您可以尝试从表单中删除 onsubmit 并执行以下操作：

$("form").submit(function() {
    if(confirm('Really submit?')) {
        jQuery.blockUI();
    }
    else {
        return;
    }
});

您的意思是这样:: jsFiddle

您可以在需要阻止ui的表单中添加id，例如：

$("#yourFormId").submit(function() {
        if(confirm('Really submit?')) {
            jQuery.blockUI();
        }
        else {
            return;
        }
    });

Answer 2

怎么样：

$("form").submit(function() {
    if(!$(this).hasClass('skip'))
    jQuery.blockUI();
});

和

<html>
  <head>
    <script src="http://malsup.github.com/jquery.blockUI.js">
    </script>
  </head>
  <body>
    <form method="POST" onSubmit="return (function(form) { var c = confirm('Are you sure?'); if(!c) { $(form).addClass('skip'); } return c; })(this);">
      <input type="submit">
    </form>
  </body>
<html>

请参阅：http://jsfiddle.net/8B8yA/5/

如何防止jQuery BlockUI触发

2 个答案: