jquery 防止重复调用两次

q9yhzks0  于 2023-11-17  发布在  jQuery
关注(0)|答案(7)|浏览(141)

我有一个上午的电话

$('#button1').on('click', function(e){
    $.ajax({
      url:  url,
      type: 'POST',
      async: true,
      dataType: 'json',
      enctype: 'multipart/form-data',
      cache: false,
      success: function(data){

      },
      error: function(){}
    });
    e.stopImmediatePropagation();
    return false;
});

字符串
现在这里的响应是在10分钟后收到的。因此,aerodynamic调用被调用多次。为什么会发生这种情况/我们如何确保aerodynamic调用只被调用一次?

sf6xfgos

sf6xfgos1#

禁用按钮的另一种方法是使用.one()方法并在回调后重新绑定事件处理程序:

var clickHandler = function(e){
    $.ajax({
      url:  url,
      type: 'POST',
      async: true,
      dataType: 'json',
      enctype: 'multipart/form-data',
      cache: false,
      success: function(data){
        $('#button1').one('click', clickHandler);
      },
      error: function(){}
    });
    e.stopImmediatePropagation();
    return false;
}

$('#button1').one('click', clickHandler);

字符串

vddsk6oq

vddsk6oq2#

我也遇到了同样的问题,当我设置async: false时,它就起作用了。

$('#button1').on('click', function(e){
    $.ajax({
      url:  url,
      type: 'POST',
      async: false,
      dataType: 'json',
      enctype: 'multipart/form-data',
      cache: false,
      success: function(data){

      },
      error: function(){}
    });
});

字符串

afdcj2ne

afdcj2ne3#

只需在调用.on()之前调用.off()即可。
这将删除所有事件处理程序:

$(element).off().on('click', function() {
    // function body
});

字符串
要仅删除已注册的“click”事件处理程序,请执行以下操作:

$(element).off('click').on('click', function() {
    // function body
});

vecaoik1

vecaoik14#

根据布伦南的回答,

$('#button1').on('click', function(e){
    $('#button1').attr('disabled', 'disabled');
    $.ajax({
      url:  url,
      type: 'POST',
      async: true,
      dataType: 'json',
      enctype: 'multipart/form-data',
      cache: false,
      success: function(data){
         $('#button1').removeAttr('disabled');
      },
      error: function(){}
    });
    e.stopImmediatePropagation();
    return false;
});

字符串
此处按钮将被禁用,并将在success上启用

xurqigkl

xurqigkl5#

对我来说,我在使用jsonp时遇到了同样的问题。
2分钟后没有回答$aaqing似乎拒绝了请求.
我怀疑是浏览器问题,因为jsonp切换到<script. tag
如果没有答案,我怀疑浏览器在~ 2分钟后重新传输请求.
我的变通方法是尽快回应任何事情,10分钟后,我的脚本要求成功与否......

ahy6op9u

ahy6op9u6#

您可以使用one()来执行此操作,如其他操作所示,或者您也可以为单击处理程序创建一个停用逻辑,该逻辑可以在需要时重新激活。在下面的示例中,go只工作一次,除非单击again,在这种情况下,go再次被重新激活,用于单个事件处理。如果您想多次重用同一个按钮来发送AJAX,但是你想在等待响应的时候停用它的事件。当然,disabled HTML属性也是你的朋友。

$('#button1').on('click', function(e) {
    if (!this.classList.contains("foo")) alert(1);
    this.classList.add("foo");
    this.value = "waiting";
});

$('#button2').on('click', function(e) {
    let btn = $('#button1');
    btn.removeClass("foo").val("go");
});

个字符

aoyhnmkz

aoyhnmkz7#

我也面临着同样的问题,更新jQuery c为true对我来说很有用。示例代码:

var clickHandler = function(e){
    $.ajax({
      url:  url,
      type: 'POST',
      async: true,
      dataType: 'json',
      enctype: 'multipart/form-data',
      cache: false,
      success: function(data){
        $('#button1').one('click', clickHandler);
      },
      error: function(){}
    });
    e.stopImmediatePropagation();
    return false;
}

$('#button1').one('click', clickHandler);

字符串

相关问题