Изменение нажатия клавиши

Question

В поле ввода или contenteditable = true div, как я могу изменить нажатие клавиши для буквы «a», чтобы вернуть keybress для буквы «b»? I.e., каждый раз, когда вы вводите букву «a» в div, вывод на самом деле является буквой «b».

Я не занимаюсь решением, которое работает в IE - только тот, который работает в Safari, Chrome, & FF.

В Chrome я вижу, что событие keypress имеет свойства «charCode», «keyCode» и «which», которым присваивается номер события нажатия клавиши. Если я запускаю событие при нажатии клавиши, я могу изменить эти значения, но я не могу понять, что вернуть, чтобы фактический ключ, который набрал, был другим. Например:

$(window).keypress(function(e){ //$(window) is a jQuery object 
    e.charCode = 102; 
    e.which = 102; 
    e.keyCode = 102; 
    console.log(e); 
    return e; 
}); 

Я также могу видеть, что наряду с charCode, который и KEYCODE, есть также свойство «originalEvent», который, в свою очередь, также обладает этими свойствами. Однако я не смог их изменить (я пробовал такие вещи, как e.originalEvent.charCode = 102).

Answer 1

Вы не можете изменить символ или ключ, связанный с событием ключа, или полностью имитировать событие ключа. Тем не менее, вы можете обрабатывать нажатия клавиш самостоятельно и вручную вставлять символ, который вы хотите, в текущую точку вставки/каретку. Я предоставил код, чтобы сделать это в нескольких местах в Stack Overflow.Для contenteditable элемента:

• Need to set cursor position to the end of a contentEditable div, issue with selection and range objects

Вот пример jsFiddle: http://www.jsfiddle.net/Ukkmu/4/

Для входа:

• Can I conditionally change the character entered into an input on keypress?

• show different keyboard character from the typed one in google chrome

Кросс-браузер jsFiddle пример: http://www.jsfiddle.net/EXH2k/6/

IE> = 9 и не И.Е. jsFiddle пример: http://www.jsfiddle.net/EXH2k/7/

Answer 2

Ну, что вы могли бы сделать для <input> или <textarea> просто убедитесь, что значение не имеет «а» символы в нем:

$('input.whatever').keypress(function() { 
    var inp = this; 
    setTimeout(function() { 
    inp.value = inp.value.replace(/a/g, 'b'); 
    }, 0); 
}); 

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

редактировать — о, и причина того, что я набрал в этом примере с «FixUp» происходит в обработчике тайм-аут, что он гарантирует, что браузер имеет возможность обработать родное поведение для «нажатия клавиши» мероприятие. Когда выполняется код обработчика тайм-аута, мы уверены, что значение элемента будет обновлено. Я понимаю, что прикосновение культа груза к этому коду.

Answer 3

Я не уверен, если это «легко» выполнимо, с чем-то вроде этого:

$(window).keypress(function(e) { 
    //Captures 'a' or 'A' 
    if(e.which == 97 || e.which == 65) 
    { 
     //Simulate a keypress in a specific field 
    } 
}); 

Я знаю, что JQuery имеет синтезированный плагин для имитации события нажатия клавиш и т.д., jQuery Simulate. Возможно, стоит посмотреть - также возможно некоторый тип события jQuery Trigger().

Answer 4

Мой пример решения (изменение в input[type=text] характере ',' к '.'):

element.addEventListener('keydown', function (event) { 
if(event.key === ','){ 
    setTimeout(function() { 
    event.target.value += '.'; 
    }, 4); 
    event.preventDefault(); 
};