Question

快速提问，如果我有提交表单的提交字段，

<input type="submit" id="btnSubmit" value="Submit" />

然后是JS Click处理程序，

$('#btnSubmit').click(function() {
   alert('clicked');
});

我保证JS处理程序首先出现，以及稍后提交的任何服务器端表单？

我认为保证这是JS处理程序中preventDefault的唯一方法。但是，如果我们不这样做，我们无法确定JS Click处理程序或服务器端操作是否会首先发生。

e.preventDefault();

我保证吗？所以没有必要e.preventDefault？

不建议任何＆＃34;常规按钮，＆＃34;我必须使用Submit字段，这是一个带有Submit字段的Struts2应用程序，该字段必须保留在表单上。

Answer 1

The JavaScript click event handler will probably fire before the form is submitted. That being said, there is no guarantee. It's a race condition. What you should do is decide what order you want the operations to occur in and code appropriately:

If you want the client-side JS code to fire before form submission, use event.preventDefault(); (NOTE: you have to pass the event param to the click handler. You did not do this in the code you posted).

Next run your client-side code. Finally, submit the form using JS:

 // pass the event param to the handler function 
 $('#btnSubmit').click(function(e) {

    //prevent immediate form submission
   e.preventDefault();

   // do whatever you want to happen BEFORE the form is submitted   
   alert('clicked');

   // to do Ajax form submission: 

   var form = $('#btnSubmit').closest.('form');
   var data = form.serialize();
   var URL = form.attr('action');

   $.ajax({
      url: URL
      data: data;
      method: 'POST'
   });

   // OR... to do non-Ajax form submission:
    var form = $('#btnSubmit').closest.('form');
    form.submit();
});

Conversely, if you want the client-side code to execute AFTER the form submission, use Ajax and do a callback:

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

   var form = $('#btnSubmit').closest.('form');
   var data = form.serialize();
   var URL = form.attr('action');

   $.ajax({
      url: URL
      data: data;
      method: 'POST'
   }).then(function () {
        alert('clicked')
   });


});

Answer 2

没关系，只需制作按钮类型按钮，用juery点击处理程序处理它，做你必须做的事情，然后提交表格

  $("btnSubmit").click(function () {

        //do what you have to do before submit
        $('form[name=createcustomer]').submit();

    });

Answer 3

我认为您混淆了两个事件undefined和click。当您单击按钮（即使用鼠标）时，会发生第一个。但是submit也会接受键盘事件。这样就可以提交没有<input type="submit">的表单。通过这种方式，您应该处理click事件以确保提交表单。

由submit生成submit事件，但如果没有阻止，可能由于上述情况而无法发生。

您可以在click事件本身上使用preventDefault()来停止提交表单。如果您将其放在submit上，但如果未发生click事件，则表单仍会提交。

点击按钮时javascript事件的顺序 - click - ＆gt; click。您可以submit或preventDefault()停止任何活动，但是当javascript关闭时，它不会阻止表单提交。

因此，如果javascript事件发生，则首先发生javascript事件的答案，然后执行该操作。

是否总是首先调用JS Handler来提交按钮（保证）？

3 个答案: