Отключение множественной отправки в HTML-формах

StackOverflow https://stackoverflow.com/questions/2145438

  •  23-09-2019
  •  | 
  •  

Вопрос

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

Я считаю, что отключение кнопки отправки с помощью JS немного проблематично, потому что, если пользователь пытается остановиться (кнопка ESC/Stop), кнопка не сбрасывается (если вы не поймаете это и не обработаете это снова с помощью JS), если пользователь возвращается (кнопка «Назад») со следующей страницы, кнопка отправки по-прежнему отключена (по крайней мере, в Firefox).

Как лучше всего отключить отправку нескольких форм?

Спасибо!

Это было полезно?

Решение

Javascript у меня работает нормально.Обеспечение того, чтобы кнопки снова стали активными, когда пользователь прерывает отправку, является частью удобства использования.

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

Другие советы

Возможно, это не ответ на ваш вопрос, но я думаю, что лучше создать что-то уникальное для идентификации запроса на стороне сервера.Проверка на стороне клиента всегда проблематична.

привяжите отключение к отправке формы, а затем отключите его к загрузке страницы (для сброса при обновлении/возврате):

function disableSubmits( domNode, toDisable )
{
    domNode = domNode || document.getElementsByTagName( 'body' )[ 0 ];

    toDisable = !!toDisable;

    for( var i = 0; i < inputs.length; ++i )
    {
        if( 'submit' === inputs[i].getAttribute( 'type' ) )
        {
            inputs[i].disabled = toDisable;
        }
    }
}

var onloadhandler = function( )
{
    var theForm = document.getElementById( 'theForm' );

    theForm.onsubmit = function( ){ disableSubmits( theForm, true ); }

    disableSubmits( theForm, false );
};

var old = window.onload;

window.onload =  'function' === typeof old
                 ? function( ){ old(); onloadhandler(); }
                 : onloadhandler;
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top