Jquery - Internet Explorer, отправляющий форму дважды

Question

У меня есть следующий код, который я использую для отправки форм со ссылками (вместо кнопок). Это сделано для того, чтобы с ними можно было что-нибудь делать с CSS.

$('a.css_submit').click(submit_form);
$('a.inactive_submit').click(submit_form);

function submit_form(event) {
  if ($(this).parents('form:first').length > 0 && !$(this).hasClass('inactive_submit'))   {
        $(this).toggleClass("css_submit inactive_submit");
    $(this).parents('form:first').submit();
    return false;
  } else {
    return true;
  }
}

Проблема в том, что Internet Explorer иногда отправляет форму дважды. Я не смог воспроизвести проблему сам, но я могу проверить это в журналах моего производственного сервера. Эта проблема сохраняется в IE6 - IE9. Все остальные браузеры работают нормально. Я видел несколько сообщений, в которых говорится, что по ссылке возвращается false, но я делаю это.

Любая помощь приветствуется.

Answer 1

Когда вы submit заполняете форму самостоятельно, вам также необходимо отменить обработку события по умолчанию.

Способ jquery: event.preventDefault():

$(this).parents('form:first').submit();
event.preventDefault();

Возвращение true / false не имеет никакого эффекта в jquery.

Answer 2

Для IE я нашел это:

event.returnValue = false;

Сначала проверьте, существует ли event.preventDefault, чтобы предотвратить возможную ошибку:

event.preventDefault ? event.preventDefault() : (event.returnValue = false);

Answer 3

Для IE, вы можете использовать следующий код:

event.returnValue = false;

мы можем проверить, существует ли protectDefault, чтобы избежать ошибки:

event.preventDefault ? event.preventDefault() : (event.returnValue = false);

Answer 4

Вы можете добавить дополнительную проверку, чтобы убедиться, что на нее не нажимают дважды:

var formSubmitted = false;

function submit_form(event) {
  if(formSubmitted  == true) { alert('Form already submitted.'); return false; } // determine if form is already submitted
  if ($(this).parents('form:first').length > 0 && !$(this).hasClass('inactive_submit'))   {
        $(this).toggleClass("css_submit inactive_submit");
    $(this).parents('form:first').submit();
    return false;
  } else {
    formSubmitted  = true;
    $('a.css_submit').attr('disabled', true); // disable form submit button
    $('a.css_submit').val('Processing...'); // set form submit button text to say processing
    return true;
  }
}