在AJAX请求时禁用按钮

我正在尝试在单击按钮后禁用它。我试过：

$("#ajaxStart").click(function() {
    $("#ajaxStart").attr("disabled", true);
    $.ajax({
      url: 'http://localhost:8080/jQueryTest/test.json',
      data: {
        action: 'viewRekonInfo'
      },
      type: 'post',
      success: function(response){
        //success process here                             
        $("#alertContainer").delay(1000).fadeOut(800);
       },
      error: errorhandler,
      dataType: 'json'
    });    
    $("#ajaxStart").attr("disabled", false);
});

但是按钮没有被禁用。当我删除

$（“#ajaxStart”）.attr（“disabled”，false）时按钮被禁用

虽然这不是预期的工作，但我认为代码序列是正确的。任何帮助都将不胜感激。
在您的代码中，您只需在同一按钮上禁用并启用该按钮，然后单击

您必须在AJAX调用完成时启用它

像这样的

           success: function(response){
                    $("#ajaxStart").attr("disabled", false); 
                       //success process here
                       $("#alertContainer").delay(1000).fadeOut(800);
                   },

放置
$（“#ajaxStart”）.attr（“禁用”，false）在成功函数中：

$("#ajaxStart").click(function() {
    $("#ajaxStart").attr("disabled", true);
    $.ajax({
        url: 'http://localhost:8080/jQueryTest/test.json',
        data: { 
            action: 'viewRekonInfo'
        },
        type: 'post',
        success: function(response){
            //success process here
            $("#alertContainer").delay(1000).fadeOut(800);

            $("#ajaxStart").attr("disabled", false);
        },
        error: errorhandler,
        dataType: 'json'
    });
});

这将确保数据加载后禁用设置为false。。。当前，您可以在同一单击功能中禁用和启用按钮，即同时启用。
调用
$.ajax（）
将不会阻止”--这意味着它将立即返回，然后立即启用按钮，因此按钮不会被禁用

通过使用
complete
，可以在AJAX成功、出错或以其他方式完成时启用该按钮：

完成（XMLHttpRequest，
文本状态）

待执行的函数
请求完成时调用
（在成功和错误后，将执行回调。）
已执行）。函数被传递
两个参数：XMLHttpRequest
对象和对
请求的状态（“成功”，
“未修改”、“错误”、“超时”或
“解析器错误”）。这是一个Ajax事件

我通过定义两个jquery函数解决了这个问题：

var showDisableLayer = function() {
  $('<div id="loading" style="position:fixed; z-index: 2147483647; top:0; left:0; background-color: white; opacity:0.0;filter:alpha(opacity=0);"></div>').appendTo(document.body);
  $("#loading").height($(document).height());
  $("#loading").width($(document).width());
};

var hideDisableLayer = function() {
    $("#loading").remove();
};

我使用ajax的全局函数解决了这个问题

            $(document).ajaxStart(function () {
            $("#btnSubmit").attr("disabled", true);
        });
        $(document).ajaxComplete(function () {
            $("#btnSubmit").attr("disabled", false);
        });

这是文档。
实际上，我会把它放在
complete
回调中，因为如果请求失败，我不一定希望按钮保持禁用状态。遗憾的是，如果阻止用户再次单击所需的时间超过用户再次单击所需的时间，那么这里的答案都不起作用。例如，如果用户在禁用按钮或在按钮上方动态添加元素之前快速（有意或无意）多次单击，则会注册多次单击。目前还没有找到解决方案。
            $(document).ajaxStart(function () {
            $("#btnSubmit").attr("disabled", true);
        });
        $(document).ajaxComplete(function () {
            $("#btnSubmit").attr("disabled", false);
        });