Почему в моем jQuery разрешен возврат, независимо от того, отфильтровываю ли я его или нет?

У меня есть этот JQuery:

$(document).on("keypress", '[id*=Float]', function (e) { 
    //only allow 1..9 (48..57), '.' (46), and backspace (8)
    var k = e.which;
    if (k === 8 || k === 46) return;
    if (k < 48 || k > 57) { e.preventDefault(); }
});

... работая над этим HTML:

<input type="text" id="txtbxFloat">
</br>
<input type="text" id="txtbxHopeFloats">
</br>
<input type="text" id="txtbxFloatingFreeAsABird">

Здесь можно поиграться

Это делает то, что говорят комментарии / что я хочу. Тем не менее, это так:

$(document).on("keypress", '[id*=Float]', function (e) { 
    //only allow 1..9 (48..57), '.' (46), and backspace (8)
    var k = e.which;
    if (k === 46) return;
    if (k < 48 || k > 57) { e.preventDefault(); }
});

IOW, "8" (backspace) разрешен в любом случае. Зачем? Я думаю, это не проблема для меня в данный момент, но что, если я действительно хочу предотвратить возврат?

3 ответа

Решение

Если вы действительно хотите предотвратить возврат, вы должны отменить привязку к событию по умолчанию и повторно присоединить его "новую" версию.

Попробуйте что-то вроде:

$(document).unbind('keydown').bind('keydown', function (event) {
    var doPrevent = false;
    if (event.keyCode === 8) {
        var d = event.srcElement || event.target;
        if ((d.tagName.toUpperCase() === 'INPUT' && (d.type.toUpperCase() === 'TEXT' || d.type.toUpperCase() === 'PASSWORD' || d.type.toUpperCase() === 'FILE')) || d.tagName.toUpperCase() === 'TEXTAREA') {
            doPrevent = d.readOnly || d.disabled;
        }
        else {
            doPrevent = true;
        }
    }

    if (doPrevent) {
        event.preventDefault();
    }
    // rest of code here
});

Я думаю keypress не срабатывает при использовании Backspace, потому что keypress срабатывает, когда вводится реальный символ (любая клавиша печати). Backspace не вводит никаких символов. В то время как keydown срабатывает, если нажата какая-либо клавиша. Вот почему keydown должно работать, чтобы предотвратить возврат.

Это то, что упоминается в спецификации Jquery

Событие нажатия клавиши отправляется элементу, когда браузер регистрирует ввод с клавиатуры. Это похоже на событие нажатия клавиш, за исключением того, что модификаторы и непечатаемые ключи, такие как Shift, Esc и события удаления нажатия клавиш запуска, но не события нажатия клавиш.** Другие различия между этими двумя событиями могут возникать в зависимости от платформы и браузера.

Я думаю, что решение будет использовать keydown вместо keypress,

События клавиатуры происходят в следующем порядке: keydown, keyup, keypress,

$(document).on("keydown", '[id*=Float]', function (e) { 
    //only allow 1..9 (48..57), '.' (46), and backspace (8)
    var k = e.which;
    if (k === 46) return;
    if (k < 48 || k > 57) { e.preventDefault(); }
});
Другие вопросы по тегам