如何停止重复Ajax后？

Question

我有输入验证和ajax后的问题。我用http://1000hz.github.io/bootstrap-validator/

这里是我的表单代码：

<form id="order-form" class="form" action="" method="post" novalidate="true" role="form" data-toggle="validator"> 
 
    <fieldset> 
 
    <div id="callback-type" class="btn-group"> 
 
     <button class="btn btn-default private-callback btn-primary" type="button" data-type="private"> 
 
     Private 
 
     </button> 
 
     <button class="btn btn-default public-callback" type="button" data-type="public"> 
 
     Public 
 
     </button> 
 
     <input class="callback-type" type="hidden" id="callback-type-data" name="callback[type]" value="private"> 
 
    </div> 
 
    </fieldset> 
 
    <fieldset style="border: none"> 
 
    <section class="callback-time-select form-group"> 
 
     <label class="input"> <i class="icon-prepend fa fa-user"></i> 
 
     <input class="callback-datetime" placeholder="<?=date('Y/m/d H:i');?>" type="text" name="callback[time]" id="callback-time" required/> 
 
     <div class="time-clear"> 
 
      <i class="fa fa-times-circle"></i> 
 
     </div> 
 
     </label> 
 
     <div class="help-block with-errors"></div> 
 
    </section> 
 
    <section class="second callback-agent-section form-group"> 
 
     <select class="callback-agent" name="callback[user]" style="width:100%" class="select2" id="select-callback-agent" required> 
 
     <option></option> 
 
     <option value="1">Name</option> 
 
     </select> 
 
     <div class="help-block with-errors"></div> 
 
    </section> 
 
    </fieldset> 
 
    <div class="tab-actions"> 
 
    <button type="submit" class="btn btn-primary btn-sm submit-button callback-btn-create">Set Callback</button> 
 
    <button type="submit" class="btn btn-primary btn-sm submit-button callback-btn-update" style="display: none;">Update Callback</button> 
 
    <button type="button" class="btn btn-default btn-sm submit-button callback-btn-remove" style="display: none;">Remove</button> 
 
    </div> 
 
</form>

这里是我的javascript代码：

$(document).on('click', '#dealing-modal #callback-tab .tab-actions .callback-btn-create', function(){ 
     $(this).closest('form').validator().submit(function(e){ 
      e.preventDefault(); 
      if (!$('.has-error').length) { 
       self.create(); 
      } 
     }); 
}); 

而且self.create方法：

create: function() 
{ 
    Application.Debug("Calllback.create"); 
    var self = this; 
var form = $(":input", this.window).serialize(); 
     form = form + '&call_id=' + this.call.id; 

$.post(Application.url+'callbacks/create', form, function(data){ 
    if(data.status === true) { 
    self.callback = data.callback; 
      $(".callback-btn-create",self.window).css('display','none'); 
      $(".callback-btn-update",self.window).css('display','inline'); 
      $(".callback-btn-remove",self.window).css('display','inline'); 
    } else { 
    Application.Debug("Calllback.create - ERROR"); 
    } 
}); 
} 

我需要验证表单输入并在点击按钮上发送ajax文章。它启动表单提交，并在表单有效后发送邮件。

而且我的问题是：

当输入是空的，我按下按钮创建，形成验证它，我看到错误文本。没关系！但是，当我点击按钮1或2次等，并在我完成所有输入后，方法self.create();做阿贾克斯帖子多少次我点击按钮。

问题在哪里？

Answer 1

您只需在ajax调用之后单击和之前禁用或在按钮下方显示none，反之亦然。

<button type="button" class="btn btn-primary btn-sm submit-button callback- btn-create">Set Callback</button> 

Answer 2

var $submitBtn; // Lets say this is the jQuery object that contains the form button element. 

$submitBtn.attr('disabled', true); 

$.post().always(function() { 
    $submitBtn.attr('disabled', false); 
}); 

而且，有一些残疾人士的造型为你的按钮，如：

input[type="submit"][disabled] { 
    opacity: .4; 
    pointer-events: none; 
} 

另一种方法：

var $form; // Lets say this is the jQuery object that contains the form element. 

if ($form.data('posting')) { 
    return false; // We are already posting data, don't do anything. 
} 

$form.data('posting', true); 

$.post().always(function() { 
    $form.data('posting', false); 
});