Изменение значения в событии нажатия клавиши обновляет страницу

#javascript #jquery

Вопрос:

Я использую jQuery для создания калькулятора. Проблема в том, что при нажатии клавиши я вызываю функцию calculate, которая вычисляет и возвращает значение. Однако, если я изменю значение в текстовом поле и снова нажму keydown, страница обновится, и все будет пустым.

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

Это код:

 lgpm.keydown(function(event){

            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
                if (formValidate()){
                    event.preventDefault();
                    return false;
                }
                else {
                calculateMet();
                }
            }
            event.stopPropagation();
        });

Ответ №1:

event.preventDefault() Метод должен вызываться всякий раз, когда нажата клавиша enter — иначе он отправит форму — попробуйте это

 lgpm.keydown(function(event){

        var keycode = (event.keyCode ? event.keyCode : event.which);
        if(keycode == '13'){
            event.preventDefault();
            if (formValidate()){
                return false;
            }
            else {
            calculateMet();
            }
        }
        event.stopPropagation();
    });

1. Этот код не сработал. Это не обновляет страницу, но и не вызывает функцию calculate при нажатии клавиши во второй раз.

2. Хорошо, я только что понял, что это работает. Но оно принимает только новое значение текстового поля, которое вводится с помощью нажатия клавиши / нажатия клавиши [это последнее текстовое поле формы, которую вводит пользователь]. ЕСЛИ я изменю значение других текстовых полей, а затем нажму keydown в последнем текстовом поле, функция calculate не вызывается, т.Е. Я предполагаю, что новые значения текстового поля не извлекаются.

3. Можете ли вы опубликовать свой полный код на JSFiddle.net возможно ? Это значительно упростит отладку… Почему у вас там есть метод stopPropagation ?

4. Вот код на jsFiddle: jsfiddle.net/Ak4qn Я не уверен, почему javascript там не работает.

5. @fuz3d У вас там было довольно много ошибок… я обновил его …. jsfiddle.net/Ak4qn/1

Ответ №2:

попробуйте добавить event.stopPropagation() после event.preventDefault()

Ответ №3:

Измените свое тело на:

 if(keycode == '13'){                                                                                              
   if (formValidate()){                                                                                          
      event.preventDefault();                                                                                   
   } else {                                                                                                      
      calculateGravelMetric();                                                                                   
   }                                                                                                             
}                                                                                                                 
return false;

… таким образом, обработка по умолчанию всегда будет предотвращена