Question

我需要提交一个表单，但是当它提交时我需要它来禁用该按钮，因为查询需要几秒钟才能运行，使用此表单的人不会理解加载页面，因此他们会点击按钮上提交5到6次，多次提交表单方式。我在Chrome中有一个工作方法，但在IE中它提交两次，我知道为什么，但我不知道如何让它为两者工作。这是表格线：

    <form method="post" id="submitItem" action="secondPage.php">

我尝试了各种版本，比如使用onSubmit或其他相关的想法，但都没有。＆＃34;工作＆＃34;在IE中提交两次的chrome解决方案是表单调用和以下JS：

$( document ).on( "click", ".once-only", function(){
    $(".once-only").prop('disabled', true);
    $('form').submit();
});

班级＆＃34;只有一次＆＃34;已添加到提交按钮，因此在单击提交时，该按钮在两个浏览器中都被禁用，但因为我有＆＃34; action =＆＃39; ....＆＃39;＆＃34;在表单实例化行中，它使用它和＆＃34; .submit（）＆＃34;提交。 Chrome不会使用操作提交，只会提交＆＃34; .submit（）＆＃34;。有没有办法让这个工作？我尝试过更改JS以使用函数或取出＆＃34; .submit（）＆＃34;的大型组合。甚至改变了表格中的内容，但我还没想出来。有任何想法吗？ IE一直在给我这个网站的问题，任何时候我使用JS，AJAX只适用于所有其他页面的chrome，所以我真的讨厌使用IE浏览器，但超过一半的人使用该网站甚至不知道什么是铬。有小费吗？如果需要，我可以分享任何其他代码！

Answer 1

试试这个：

$( document ).on( "click", ".once-only", function(event) {
  event.preventDefault(); //this should disable the default form submit action
  $(".once-only").prop('disabled', true);
  $('form').submit();
});

Answer 2

但在IE中提交两次

为此，您可以先off或取消绑定点击后跟on

// If the button is not dynamically generated , there is no need to delegate the event
$('.once-only).off('click').on( "click",function(event){
   // Rest of the code
})

第二期

您可以使用button type = "button"，然后使用ajax而不是action

或者，您可以使用button type="submit"

$('.once-only').off('click').on( "click",function(event) {
  event.preventDefault(); //prevent default behavior 
  $(".once-only").prop('disabled', true);
   $.ajax({
    url:'some url'
    //Rest of code
    })
});

注意ajax也适用于IE

Answer 3

修改

或者像这样：onclick="this.form.submit();this.enabled=false;"

所以真正的答案是这个

onclick="setTimeout((function(){ this.disabled = true; }).bind(this),0);"

说明：这会指示浏览器稍后停用该按钮;因为JS在事件循环中工作，所以你将超时事件排列在onclick事件之外。

我认为让我做这个伎俩只是愚蠢的铬。

Javascript表单提交问题

3 个答案: