JavaScriptが入力フィールドの最後にジャンプするのを止めます。

Question

JavaScript（テキスト入力エリア）から無効な文字を取り除くために正規表現を使用しています。私はすべてのkeyupイベントでreplace関数を実行します。ただし、これにより、キーを押すたびにカーソルがテキストボックスの最後に移動し、インライン編集が不可能になります。

ここでは、アクションである：

http://jsbin.com/ifufuv/2

は、誰もがそれはそうカーソルが入力ボックスの最後にジャンプしないようにする方法を知っていますか？

Answer 1

手動でカーソルを必要な場所に戻す必要があります。 IE9の場合、.selectionStartと.selectionEnd（または.setSelectionRange(start, end)を使用）を設定します。 IE8以前の場合は.createTextRange()を使用し、テキスト範囲には.moveStart()を呼び出してください。

Answer 2

gilly3's answerに加えて、実際のコードスニペットを見てみると便利だと思っていました。

以下の例では、selectionStartプロパティは、JavaScript文字列操作の前にinput要素から取得されます。その後、selectionStartは、の操作後に初期位置に戻されます。

達成しようとする内容に応じて、selectionStartの代わりにselectionEndにアクセスして、範囲：setSelectionRange(start, end)を設定することもできます。

document.getElementById('target').addEventListener('input', function (e) { 
 
    var target = e.target, 
 
     position = target.selectionStart; // Capture initial position 
 
    
 
    target.value = target.value.replace(/\s/g, ''); // This triggers the cursor to move. 
 
    
 
    target.selectionEnd = position; // Set the cursor back to the initial position. 
 
});

<p>The method <code>.replace()</code> will move the cursor's position, but you won't notice this.</p> 
 
<input type="text" id="target" />