更改HTML文本框:覆盖而不是作为用户类型插入

101*_*100 5 html javascript jquery

我正在开发一项允许编辑文本的服务.为了帮助用户完成此过程,我想允许用户将文本字段设置为覆盖模式,如Word中所示,等等.如何将HTML文本框的行为更改为覆盖而不是插入文本作为用户类型?

例如,如果文本框有文本:

This is a trst.
Run Code Online (Sandbox Code Playgroud)

用户可以在r和t之间单击,键入单个e,然后文本将是

This is a test.
Run Code Online (Sandbox Code Playgroud)

用光标es.之间的光标.我目前正在使用jQuery,因此使用该方法或纯javascript的方法将是首选.不过,我会接受任何合理的解决方案.

Vis*_*ioN 12

这有点疯狂,但它似乎以某种方式工作:)

根据这个答案这个答案,创建了这段代码.

$("textarea").on("keypress", function(e) {
    var key = String.fromCharCode(e.which || e.charCode || e.keyCode);
    if (/[A-Za-z0-9 ]/.test(key)) {
        var text = this.innerHTML;
        var caret = getCaret(this);
        var output = text.substring(0, caret);
        this.innerHTML = output + key + text.substring(caret + 1);
        setCaretPosition(this, caret + 1);
        return false;
    }
    return true;
});?
Run Code Online (Sandbox Code Playgroud)

演示: http ://jsfiddle.net/aHSzC/

它工作但现在我没有时间修复我发现的小错误.

  • 如果你按下Backspace它似乎表现得像一个前进橡皮擦.

无论如何,这里是可以改进的代码.随意编辑我的答案,做任何你喜欢的事情.