0

我正在使用一个JQuery工作正常的对话插件，除了表单在用户能够单击任何按钮进行确认之前提交。我已经添加了preventDefault，但取决于我放置它的位置，它要么完全停止提交表单，要么完全忽略，并且表单只是在没有确认的情况下提交

<script type="text/javascript">
  $(document).ready(function() {  
    $('#perm_del_submit').click(function(ev){
      $.msgbox("Are you sure?", {  
        type: "confirm", 
        buttons: [
          {type: "submit", value: "Yes"},
          {type: "cancel", value: "No"}
        ]
      }, function(result) {
        if (result == 'Yes') {
          $('#audit_sort_form').submit();
        }
      });
    ev.preventDefault();   
    });
  });
</script>
4

4 回答 4

0

回调函数在确认窗口创建后触发。这就是为什么它甚至在他们回答确认之前就调用提交。根据代码，当它显示confirm时，它认为它的处理完成了，que中的next是回调函数。如果我没记错的话，您必须将您的提交功能应用于“点击”事件。

于 2013-10-10T19:02:40.947 回答
0

我猜你的实际提交按钮（#perm_del_submit）是一个<input type="submit"/>？使它成为一个<input type="button"/>？

于 2013-10-10T19:31:38.050 回答
0

不要将处理程序绑定到“单击”事件，而是绑定到表单提交事件（如果我在表单中并且我选择提交按钮并按 Enter，我已经提交了表单但完全绕过了您的处理程序函数。这种情况也不少见）。

如果您想按照您建议的方式进行操作，您还必须在消息框显示后给您的表单一个标志（我在下面的示例中使用了“可提交”）。

$('#audit_sort_form').on('submit',function(e) {
   var el = $(this),submittable = el.data('submittable');

   if(!submittable) {
    e.preventDefault();


      $.msgbox("Are you sure?", {  
        type: "confirm", 
        buttons: [
          {type: "submit", value: "Yes"},
          {type: "cancel", value: "No"}
        ]
      }, function(result) {
        if (result == 'Yes') {
         el.data('submittable',true);
         el.submit();
        }
      });
   }


});
于 2013-10-10T19:10:10.360 回答
0

对于验证表单或确认表单提交，我建议处理表单submit事件而不是按钮click事件。提交表单的方法不止一种，因此除非您只关心何时通过单击特定按钮提交表单，否则请处理表单提交事件。

另一个要养成的好习惯是先打电话e.preventDefault()。这样，如果出现 JavaScript 错误，或者return函数内有语句，表单提交仍然会被取消。

$("#audit_sort_form").submit(function(e) {
    e.preventDefault();
    var form = this;
    $.msgbox("Are you sure?", {  
        type: "confirm", 
        buttons: [
            {type: "submit", value: "Yes"},
            {type: "cancel", value: "No"}
        ]
    }, function(result) {
        if (result == "Yes") {
            form.submit();
        }
    });
});

当通过调用元素的submit()方法提交表单时，不会调用提交事件。此外，该按钮不包含在表单帖子中。因此，如果您的服务器端处理程序依赖于包含的提交按钮的值，您将不得不使用隐藏输入来欺骗它。如果同一个表单有多个按钮，并且单击哪个按钮对服务器很重要，请在表单中放置一个隐藏字段：<form>

<input type="hidden" name="perm_del_submit" />
<input type="submit" value="a" />
<input type="submit" value="b" />

单击按钮时设置字段的值：

$("input[type=submit]").click(function(){
    this.form.perm_del_submit.value = this.value;
});

然后，让submit上面的处理程序处理表单提交。隐藏的输入值已经设置好了，并且会指示哪个按钮触发了表单提交。

于 2013-10-10T22:38:56.867 回答