On keypress does not fire on the first key press

Question

I have this method:

$(".txtB").on("keypress", function(event) {
    console.log($(this).val());
    if (...)
        event.preventDefault();
});

But it works only after the second key pressed not for the first one. After that is triggered on every key press. Anyone have an idea what could be?

Thanks.

Later edit: It might be related to the way i use the function?

in HTML: onkeyup = "caseValuePercentageTwoDecimalRestriction()"

in JS:

function caseValuePercentageTwoDecimalRestriction() {
    $(".caseValuePrecentageRestriction").on("keypress", function (event) {
        ...

??

Answer 1

$(".txtB").keyup(function (event) {
     console.log($(this).val());
});

To answer your question, Keypress event happens before the input change. But Keyup happens after the change. That's the only difference.

Answer 2

The error is calling caseValuePercentageTwoDecimalRestriction on keyup event which is fired after keypress event.

keyup is called when you release the key while keypress is called when you press the key.

You should bind you keypress event handler on a document.ready event like this:

$(document).ready(function() {
    $(".caseValuePrecentageRestriction").on("keypress", function (event) {
        // do whatever you need
    });
});