Zmiana keypressa

Question

W polu wejściowym lub contenteditable = true div, w jaki sposób mogę zmodyfikować naciśnięcie klawisza litery "a", aby zwrócić klucz do litery "b"? Oznacza to, że za każdym razem, gdy wpiszesz literę "a" w dziale, wynik jest w rzeczywistości literą "b".

Nie interesuje mnie rozwiązanie działające w IE - tylko takie, które działa w Safari, Chrome, & FF.

W Chrome widzę, że zdarzenie naciśnięcia klawisza ma właściwości "charCode", "keyCode" i "which", z których wszystkie otrzymują przypisany numer zdarzenia keypress. Jeśli wystrzeliwam zdarzenie przy naciśnięciu klawisza, mogę zmodyfikować te wartości, ale nie wiem, co zwrócić, aby właściwy wpisywany klucz był inny. Na przykład:

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

Mogę także zobaczyć, że wraz z charCode, co i kod, istnieje również „originalEvent” nieruchomość, która z kolei posiada te właściwości. Jednak nie byłem w stanie zmodyfikować tych (próbowałem z takimi elementami, jak e.originalEvent.charCode = 102).

Answer 1

Nie można zmienić znaku lub klucza związanego ze zdarzeniem kluczowym ani w pełni symulować zdarzenia klucza. Jednak możesz samodzielnie obsłużyć naciśnięcie klawisza i ręcznie wstawić znak, który chcesz w bieżącym punkcie wstawienia/kurtynie. Dostarczyłem kod, aby to zrobić w wielu miejscach w Stack Overflow.Dla contenteditable element:

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

Oto przykład jsFiddle: http://www.jsfiddle.net/Ukkmu/4/

dla wejścia:

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

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

Cross-browser jsFiddle przykład: http://www.jsfiddle.net/EXH2k/6/

IE> = 9 a-IE nie Przykładem jsFiddle: http://www.jsfiddle.net/EXH2k/7/

Answer 2

Więc co można zrobić dla <input> lub <textarea> się tylko upewnić, że wartość nie ma żadnych znaków „A” w IT:

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

Podejście to prawdopodobnie nie mogła obsługiwać wszystkie możliwe sztuczki, które można pociągnąć za pomocą czegoś, co naprawdę wymieniłoby "wciśniętą" postać, ale nie wiem, jak to właściwie zrobić.

edit — oh, a powodem, że wpisany w tym przykładzie z „fixup” dzieje się w przewodnika limitu czasu jest to, że daje pewność, że przeglądarka ma możliwość obsługi natywnej zachowanie za „naciśnięcie klawisza” zdarzenie. Po uruchomieniu kodu obsługi limitu czasu jesteśmy pewni, że wartość elementu zostanie zaktualizowana. Wiem, że w tym kodzie jest odrobina kultu ładunku.

Answer 3

Nie jestem pewien, czy to jest „łatwy” do-stanie, z czegoś takiego:

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

wiem, że jQuery posiada wtyczkę symulacyjny do symulacji keypress imprez itp, jQuery Simulate. Być może warto się przyjrzeć - również prawdopodobnie jakiś typ zdarzenia jQuery Trigger().

Answer 4

Mój przykład rozwiązanie (zmiana input[type=text] postać ',' do '.'):

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