javascript - 在文本输入字段上模拟退格键

Question

有人可以提供一个很好的例子来模拟文本字段上的退格键吗？<INPUT>

我需要这个在 HTML5 中完成的虚拟键盘，它只需要在Webkit浏览器中工作。

笔记：

• createEvent// initTextEventcharcode dispatchEvent8（退格）被忽略（这似乎只适用于可打印字符）
• 手动更改valueusingsubstr()类型的作品，但这样插入符号移动到输入字段的末尾（我希望能够删除输入字段中间的字符，就像使用普通键盘时一样）。

Answer 1

好吧，你去：http: //jsfiddle.net/dan_barzilay/WWAh7/2/

get caret 函数用于知道在哪里删除字符，如果您需要更多解释性注释。重置光标功能用于在退格后恢复插入符号的位置。

**它正在使用 jquery，但您可以在几秒钟内将其更改为普通 js

Answer 2

编辑：以下内容太复杂而无法使用。根据 https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand，调用document.execCommand("delete");.

这是我使用的解决方案setSelectionRange，它在 Chrome 上运行良好： https ://github.com/gdh1995/vimium-plus/blob/master/lib/dom_utils.js#L169

simulateBackspace: function(element) {
    var start = element.selectionStart, end = element.selectionEnd, event;

    if (!element.setRangeText) { return; }
    if (start >= end) {
      if (start <= 0 || !element.setSelectionRange) { return; }
      element.setSelectionRange(start - 1, start);
    }

    element.setRangeText("");
    event = document.createEvent("HTMLEvents");
    event.initEvent("input", true, false);
    element.dispatchEvent(event);
}

好吧，唯一的不足是我们无法撤消它所做的更改。

添加：我找到了一种启用撤消和重做的方法：在Javascript textarea undo redo中，这两个 anwsers 在 Chrome 上运行良好