Отключить/включить событие jQuery click, чтобы избежать нескольких запросов POST.

У меня есть веб-страница с некоторыми новостями, и кнопка, при нажатии которой показывает старые новости, делающие вызов AJAX на сервер.Отключить/включить событие jQuery click, чтобы избежать нескольких запросов POST.

Проблема в том, что если люди нажимают слишком быстро, запрос выполняется дважды, поэтому я получаю 2 равных ответа.

# MAS-Noticias-колонтитула идентификатор кнопки, который отображает старые новости
.noticias-лист класс asigned к каждому новому, с использованием .length я получаю количество новостей отображается и POST этот номер в файл PHP, который выполняет SQL-запрос с использованием LIMIT (numItems, 3) (я получаю 3 новости за раз).
# Noticias-дисплей является уль, который содержит новости

Это код

$(document).ready(function() { 
    $("#mas-noticias-footer").on('click',function() { 
var numItems = $('.noticias-list').length; 
$.ajax({ 
     type: "POST", 
     url: "mas-noticias.php", 
    data: "num-noticias="+numItems, 
    success: function(data) { 
      $('#noticias-display').append(data); 
      } 
}); 
    }); 
});

Я попытался с помощью выключения() и отменяя событие в начале при обратном вызове, чтобы избежать множественных вызовов (что работает), проблема заключается в том, когда я делегирую событие, используя on() в конце обратного вызова, я не могу заставить его работать.

источник

2012-04-12 davidaam

Попробуйте event.preventDefault() .... см. http://api.jquery.com/event.preventDefault/ – Baba

Я сделаю снимок, но не event.preventDefault() предотвращает действие по умолчанию, например, в привязке, если вы добавите обработчик клика с e .preventDefault предотвращено действие по умолчанию, которое происходит с указанным href? – davidaam

поместите его после '$ (" # mas-noticias-footer "). On ('click', function (event) {' – Baba

Вы не можете позвонить по телефону off, а затем позвонить on, ожидая, что связанное событие возвращено именно так, событие не сохраняется в памяти.

Однако вы можете установить переменные данные внутри DOM:

$("#mas-noticias-footer").on('click',function() { 
    var numItems = $('.noticias-list').length; 
    var isAjaxRunning = $(this).data('iar'); 

    // check flag is set 
    if(typeof isAjaxRunning == 'undefined') $(this).data('iar', 'yes'); 
    else if(isAjaxRunning == 'yes') return; // if still running, return 

    $.ajax({ 
     type: "POST", 
     url: "mas-noticias.php", 
     data: "num-noticias="+numItems, 
     success: function(data) { 
      $('#noticias-display').append(data); 
      $(this).data('iar', 'no'); // after successful run, set to no 
     } 
    }); 
    });

источник

2012-04-12 01:49:59

Я пробовал что-то подобное, я проверил логическую переменную в начале обработчика событий, если это правда, тогда верните , тогда, если это ложно, установите его в true и при успешном вызове ajax я вернул его в false. Это не сработало, я дам ему шанс на ваше решение в любом случае – davidaam

Это действительно сработало!Я буду помнить об этом, когда мне нужно избегать многократного запуска событий, но в других обстоятельствах. – davidaam

$(document).ready(function() { 
    $("#mas-noticias-footer").on('click', getnews); 

    function getnews() { 
     $("#mas-noticias-footer").off('click', getnews); 
     var numItems = $('.noticias-list').length; 
     $.ajax({ 
      type: "POST", 
      url: "mas-noticias.php", 
      data: "num-noticias="+numItems, 
      success: function(data) { 
       $('#noticias-display').append(data); 
      }, 
      complete: function() { 
       $("#mas-noticias-footer").on('click', getnews); 
      } 
     }); 
    } 
});

Если вы используете on() с делегированием, обязательно используйте off() таким же образом.

источник

2012-04-12 01:49:46 adeneo

Я не верю, что вы действительно хотите асинхронный вызов здесь. Установите async:false или используйте $.post() вместо $.ajax().

источник

2012-04-12 01:55:09 Malk

На самом деле я не думал об этом, это была проблема, отключив асинхронные вызовы, неважно, вызвано ли событие несколько раз , потому что мне нужно только избежать одновременных вызовов AJAX. Благодаря! – davidaam

Вы пытались отключить кнопку?

$(document).ready(function() { 
    $("#mas-noticias-footer").on('click',function() { 
     var self=this; 
     $(self).attr('disabled','disabled'); //<-Disable 
     var numItems = $('.noticias-list').length; 
     $.ajax({ 
      type: "POST", 
      url: "mas-noticias.php", 
      data: "num-noticias="+numItems, 
      success: function(data) { 
       $('#noticias-display').append(data); 
       $(self).removeAttr('disabled');//<-Enable 
      } 
     }); 
    });

источник

2012-04-12 01:59:44

это не кнопка, это якорь – davidaam

Я знаю, что это был дан ответ уже, но я сделал решение с использованием $.unbind, а также отделение Кодекса немного

Demo

источник

2012-04-12 02:15:50 MilkyWayJoe

Отключить/включить событие jQuery click, чтобы избежать нескольких запросов POST.

ответ

Смежные вопросы