Требуется разъяснение относительно события нажатия клавиш Javascript и jQuery

Question

У меня есть следующий код jQuery:

$("#someTextInputID").keydown(function(event){
 console.log(event.keyCode);
 console.log("input_box.val(): "+input_box.val());
 console.log("input_box.val().length: "+input_box.val().length);
})

Меня удивляет то, что, если я набираю «750», регистрируются три keyCodes, но я также получаю это в своей консоли после ввода строки выше:

input_box.val (): 75

input_box.val (). Length: 2

Что происходит с последним символом, т.е.0" ?

Answer 1

Довольно просто, последняя нажатая клавиша не входит в .value из input до события keyup.

Порядок событий при нажатии клавиши:

1. keydown (срабатывает не более одного раза при нажатии клавиши, клавиша доступна в event.which, но не в .value)
2. keypress (срабатывает не менее одного раза при нажатии клавиши (например,если удерживать клавишу нажатой), клавиша доступна в event.which, но не в .value)
3. keyup (срабатывает не более одного раза при нажатии клавиши, клавиша доступна в event.which, и in .value)

Вы можете определить, какая клавиша была нажата во время фазы keydown или keypress, изучив свойство whichобъекта Event и с использованием метода String.fromCharCode.

Еще один полезный прием, который вы можете использовать, - это использовать setTimeout, но передать значение 0 в качествезадержка.Задержка в 0 добавляет обратный вызов к задней части стека вызовов, что задерживает выполнение достаточно долго для обновления .value .:

$("#someTextInputID").keydown(function(event){
    var that = this;

    setTimeout(function () {
        console.log(that.value); // will record value
    }, 0);
})    

Answer 2

Используйте это

$("#someTextInputID").keyup(function(event){
 console.log(event.keyCode);
 console.log("input_box.val(): "+input_box.val());
 console.log("input_box.val().length: "+input_box.val().length);
})