Отключите кнопку HTML после нажатия, чтобы предотвратить двойной щелчок

Question

Я хочу предотвратить двойной щелчок, поэтому настройка disabled атрибут на input Элемент после события щелчка кажется правильным решением. И другие ответы на stackru отражают это. Вот что я написал в CoffeeScript с помощью jQuery:

$('input[type="submit"]').on('click', ->
  $(this).addClass('disabled').attr('disabled', 'disabled')
  $(this).val('Sending')
)

я имею addClass('disabled') для основания.

Обычно это работает. Однако, если я нажму назад, кнопка все равно будет отключена. Если я захожу на страницу и страница была кэширована, кнопка все равно отключена. Есть ли библиотека JavaScript, которая решает все эти маленькие проблемы? Похоже, это очень распространенная потребность. Есть ли еще немного JavaScript/jQuery, который мне нужно добавить к вышесказанному?

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

ОБНОВЛЕНИЕ: я пытался слушать pageshow события и отключить кнопки отправки:

$('input[type="submit"]').on('pageshow', function() {
  console.log('pageshowed')
  $(this).removeClass('disabled').removeAttr('disabled').val('Submit');
});

Ничего не происходит, даже когда страница загружается впервые. Я использую pageshow неправильно?

Answer 1

Использовать pageshow событие на window объект. Работает в Chrome и Safari, а также Firefox, не уверен в IE, не работает в Opera 12 (но будет работать в Opera 15, так как тот же движок, что и Chrome). Пытаться typeof window.onpageshow в консоли, чтобы обнаружить.

Answer 2

Я использую этот метод:

$(document).ready(function() {
  $('.auto-submit-disable')
    .submit(function () {
      $(this).find('button,input[type=submit]')
        .attr('disabled', 'true');
    });
});

if ($('.auto-submit-disable'))
  window.onunload = function(){}; // This forces re-execution of js

После этого просто поставить class="auto-submit-disable" на ваших формах. Обратите внимание, что этот метод тяжел для браузеров, потому что повторять все JS при обратной навигации тяжело.

Так что это не рекомендуется в качестве общего метода для запуска на всех ваших страницах!