JQuery предотвращает другие события после щелчка

Я пытаюсь предотвратить множественные клики по ссылкам и элементам, что вызывает проблемы.

Я использую jQuery для привязки событий нажатия к кнопкам (jQuery UI) и ссылкам изображения (<a><img /></a>).

Есть ли способ сделать-один раз для всех, чтобы предотвратить запуск других событий после щелчка?

Или мне нужно сохранить глобальную переменную с именем _isProcessing и установить ее для true для каждого обработчика событий?

Спасибо

Изменить: (разъяснение) Спасибо за ваши ответы, моя проблема не мешает пузырению события, но предотвращает несколько одновременных кликов.

Ответы

Ответ 1

Существуют различные способы предотвращения одновременных кликов от запуска кода.

Один из способов состоит в unbind('click') элемента, затем .bind() снова, когда вы будете готовы.

Я предпочел бы использовать какой-то флаг. Это может быть переменная, но я бы предпочел присвоить класс элементу, например .processing, и удалить его, когда закончите. Таким образом, вы должны проверить обработчик на наличие этого класса для определения кода, который должен выполняться.

$('someElement').click(function() {
    var $th = $(this);
    if($th.hasClass('processing'))
          return;
    $th.addClass('processing');
    // normal code to run
    // then when done remove the class
    $th.removeClass('processing');
});

Другим вариантом является использование элементов .data() для установки аналогичного флага, например $(this).data('processing', true); Затем установите значение false при завершении.

Ответ 2

Существует event.preventDefault, event.stopPropagation и вернуть false, как уже было сказано.

$("a").click(function(e) {
    e.preventDefault();
    e.stopPropagation();
    return false;
}

Ответ 3

Вы проверили preventDefault?

$("a").click(function(e) {
    e.preventDefault();
}

вы также можете попробовать stopImmediatePropagation() или stopPropagation()

Вы также можете посмотреть one() событие.

Прикрепите обработчик к событию для элементы. Обработчик выполняется в один раз за элемент.

Ответ 4

Верните false из обработчиков событий или вызовите ev.stopPropagation() в каждом обработчике.

Ответ 5

У вас есть несколько вариантов:

Если ваши кнопки/ссылки будут перезагружены страницы, вы можете просто отпереть обработчик события клика:
```
$('input:submit').click(fumction() {
    $(this).unbind('click');
    // Handle event here 
})
```
Вы можете отключить кнопки и снова включить их после завершения (я думаю это также должно работать с <input type="image">):
```
$('input:submit').click(function() {
    $(this).attr('disabled', 'disabled');
    // It also helps to let the user know what going on:
    $(this).val('Processing...');
    // Handle event here 
    $(this).removeAttr('disabled');
})
```
Я не думаю, что это работает на ссылках.

Ответ 6

Другим способом было бы использовать event.stopPropagation() и событие .isPropagationStopped() для сигнализации:

Пример:

$(button).click(function(e){
    if(e.isPropagationStopped())
        return; // propagation was stopped, so stop further execution

    // if you got this far - this event handler was called first
    // custom logic goes here

    // stop event propagation to signal other handlers
    e.stopPropagation();

    // if you need, call e.preventDefault() to prevent default behaviour
});

Повторите эту же логику для других обработчиков событий.