javascript - 停止光标跳转到javascript替换中输入字段的末尾

Question

我正在使用正则表达式从 javascript(在 IE 中运行)的文本输入区域中去除无效字符。我在每个 keyup 事件上运行替换函数。但是，这会使光标在每次按键后跳到文本框的末尾，从而无法进行内联编辑。

这是实际操作:

http://jsbin.com/ifufuv/2

有谁知道如何让光标不跳到输入框的末尾吗？

Answer 1

除了gilly3's answer ，我认为有人可能会发现查看实际代码片段很有用。

在下面的示例中，selectionStart 属性是在 JavaScript 字符串操作之前从 input 元素中检索的。然后 selectionStart 设置回初始位置 after 操作。

根据您要实现的目标，您还可以访问 selectionEnd 代替 selectionStart，并设置一个范围: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" />