jQuery Disable Enter Key после нажатия клавиши Enter, когда клавиша Enter уже отключена

Я отключил свой ключ ввода, чтобы можно было отправлять ajax, но я хочу убедиться, что форма не будет отправлена ​​дважды, если пользователь дважды нажмет клавишу ввода, прежде чем ответ от сервера вернется.

Здесь я отключил клавишу ввода и назначил ей функцию под названием submitForm():

$(document).ready(function(){
    offset = $("#quantity").html();
    $("#lastName").focus();
    $(document).bind("keypress" , function(e){
        if (e.which == 13 && (!$("#notes").is(":focus")) && (!$("#submit").is(":focus"))) {
            submitForm(); return false;
        }
    })
    $("#submit").click(function(){ submitForm(); });
});

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

Я нашел это: Как отключить клавишу Enter / Return после того, как из-за нее выполняется функция?, но он не отвечает на мой вопрос, потому что в примере автора сценарий проверяет, есть ли что-нибудь в поле, но я хочу проверить, отправил ли я отправку или нет. Я не уверен, как это сделать. То, что я действительно хотел бы сделать, это отключить клавишу ввода, пока я не получу ответ от сервера на вызов ajax. Вот submitForm():

function submitForm() {
    $.post("/ajax/files" , $("#files").serialize(), function(data){
        filesReset();
        if (data != "") {
            $("#lastInsert table tbody:last").prepend(data);
            $("#lastInsert table tbody:last tr:first").find("td").hide();
            $("#lastInsert table tbody:last tr:first").find("td").fadeIn(1000);
            $("#lastInsert table tbody:last tr:first").effect("highlight" , {"color": "aqua"}, 1000);

            $("#lastInsert table tbody:last tr:last").remove();
        } else {
            alert("Insert rejected: either insufficient criteria or the server is down.");
            $("#hidden").click();
        }
    });
}

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

Источник

2 ответа

Решение

Используйте переменную как это:

$(function(){

    var running = false;

    $(document).bind("keypress" , function(e){
        if (e.which == 13) {
            if(running === false) {
                running = true;
                submitForm();
            }
            return false;
        }
    })

    $("#submit").click(function(){
        if(running === false) {
            running = true;
            submitForm(); 
        }
    });

});
Источник

Намного проще просто изменить кнопку отправки, чем обычную кнопку, и использовать событие onclick для отправки формы с использованием JavaScript. Таким образом, нажатие Enter ничего не делает. Отключите кнопку, когда она нажата, и включите ее в случае успешного вызова Ajax.

Источник
Другие вопросы по тегам