Question

我有一个输入元素：

<input type="text" id="t" value="abcdefghij" />

我想创建一个selectionStart

document.getElementById("t").selectionStart

我需要的功能是：

function GetSelectionStart(o) {
    if (o.createTextRange) {
        var r = document.selection.createRange().duplicate()
        r.moveEnd('character', o.value.length)
        if (r.text == '') return o.value.length
        return o.value.lastIndexOf(r.text)
    } else return o.selectionStart;
}

function GetSelectionEnd(o) {
    if (o.createTextRange) {
        var r = document.selection.createRange().duplicate()
        r.moveStart('character', -o.value.length)
        return r.text.length
    } else return o.selectionEnd;
}

如何在IE上将此“属性”添加到<input type="text" />？有可能吗？

Answer 1

您需要扩展HTMLInputElement界面，如下所示：

HTMLInputElement.prototype.selectionStart = …

但是，JavaScript专家认为这是bad practice。

Answer 2

首先，尝试扩展宿主对象在原则上和实践中都是一个坏主意。诸如DOM元素之类的宿主对象可以做他们喜欢的事情;特别是，他们没有义务支持你想要做的事情，在IE＆lt; = 8中，这就是你用这个代码所针对的东西，DOM元素根本就不支持这个。您可以选择使用传递输入元素的函数，也可以为每个具有所需方法和属性的输入创建包装器对象。

其次，您的GetSelectionStart()和GetSelectionEnd()函数存在缺陷：它们无法在textareas中正确处理新行，并且在lastIndexOf周围出现错误逻辑（如果所选文本出现多次，该怎么办？在输入？）。我已经做了很多相关的工作，并且已经提出了我相信在所有主要浏览器中获取输入和textarea选择的最佳功能，我几天前在这里发布过： Is it possible to programmatically detect the caret position within a <input type=text> element?

Answer 3

这些问题也回答了这个问题：

Caret position in textarea, in characters from the start

Character offset in an Internet Explorer TextRange

如何为输入元素添加原型？

3 个答案: