keypressを変更する

Question

入力ボックスまたはcontenteditable = true divでは、文字 "b"のキーレスブを返すために、文字 "a"のキー入力を変更するにはどうすればよいですか？つまり、divに文字「a」を入力するたびに、出力は実際には文字「b」になります。

私はIEで動作するソリューションではなく、Safari、Chrome、& FFで動作するソリューションには関心がありません。

Chromeでは、キー入力イベントに「charCode」、「keyCode」、および「which」というプロパティがあり、キー入力イベント番号が割り当てられていることがわかりました。 keypressでイベントを発生させると、これらの値を変更できますが、実際に入力されたキーが異なるように何を返すのか分かりません。たとえば：

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

私はまた、charCodeは、とキーコードと一緒に、また今度にもこれらの性質を持っている「originalEvent」プロパティがあることがわかります。しかし、私はそれらを修正することができませんでした（私はe.originalEvent.charCode = 102のようなものを試しました）。

Answer 1

キーイベントに関連付けられた文字またはキーを変更することも、キーイベントを完全にシミュレートすることもできません。ただし、キー入力を自分で処理し、現在の挿入ポイント/キャレットで必要な文字を手動で挿入することができます。スタックオーバーフローのいくつかの場所でこれを行うためのコードを提供しました。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と非IE 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); 
}); 

は、このアプローチは、おそらくすべての可能扱うことができませんでしたがあなたが実際に「押された」キャラクターをスワップしたもので引っ張ることができるトリックですが、実際にそれを行う方法はわかりません。

編集 —ああ、とタイムアウトハンドラで何が起こっ「フィックスアップ」とは、それはブラウザが「キー入力」のネイティブ動作を処理する機会を持っていることを確認することであると私はその一例で入力した理由イベント。タイムアウトハンドラコードが実行されると、要素の値が更新されたことが確認されます。このコードには、貨物カルトのタッチがあります。

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(); 
};