onekeydown возвращает строку "Обработка" для каждого нажатия клавиатуры в Firefox 65.0 Ubuntu 18.04

Я использую Firefox 65.0 для своей веб-разработки. Мой код проекта содержит ввод пароля. Я разработал это раньше, чем год назад, используя код JS, который обнаруживает нажатия клавиш, используя onkeydown а также onkeyup функции. Он отлично работает для всех браузеров, кроме новой версии Firefox 65.0

Мой код похож на это:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type=password id="button" autocomplete_="off"></input>

<script>
  $("#button").keydown(function(event) {
    console.log("key: " + event.key);
  });

  document.getElementById("button").onkeydown = function(event) {
    console.log("key: " + event.key);
  };
</script>

Для обоих случаев event.key значение не нажата кнопка, а просто "Process" как строка У кого-то есть идея, почему я получаю этот результат? Как я могу решить это и определить реальное значение нажатой клавиши?

Моя версия ОС: это Ubuntu 18.04

Изменить: добавить снимок экрана отладки

Кроме того, я не могу найти атрибут под событием, который может мне помочь

ниже вы можете увидеть снимок экрана отладки в обработчике onkeydown для случая клавиши "a".

1 ответ

Решение

Существует несколько различных свойств событий для кодов клавиш, и все они возвращают что-то немного другое. Пытаться event.which и если это не сработает, вот список других свойств события

Отредактировано, чтобы предоставить дополнительную информацию

Я провел некоторое тестирование, причина в том, что вы пытаетесь регистрировать нажатия клавиш на входе типа = "пароль". Я протестировал ваш фрагмент кода в Firefox после удаления type="password" и обоих event.which а также event.key работать нормально. Я полагаю, что Firefox намеренно запутывает его, чтобы избежать скриптов, регистрирующих нажатия клавиш паролем. Если вам нужно значение пароля, используйте event.target.value в слушателе событий. Также я бы порекомендовал использовать событие "keyup", а не "keydown", иначе вы столкнетесь с проблемой повторного запуска слушателя, когда вы удерживаете клавишу.

С атрибутом пароля

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="password" id="button" autocomplete_="off"></input>

<script>  
  // Either remove the password type on your button, or access the event.target.value property and slice out the last keypress
  document.querySelector("#button").addEventListener('keyup', (event) => {
   console.log(`Which: ${event.which}, Key: ${event.key}`);
    console.log(`Value: ${event.target.value}`);
  });
</script>

Без атрибута пароля

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="button" autocomplete_="off"></input>

<script>  
  // Either remove the password type on your button, or access the event.target.value property and slice out the last keypress
  document.querySelector("#button").addEventListener('keyup', (event) => {
   console.log(`Which: ${event.which}, Key: ${event.key}`);
    //console.log(`Value: ${event.target.value}`);
  });
</script>

Другие вопросы по тегам