JS / jQuery:如何在textarea中突出显示或选择文本?

时间:2011-01-06 13:31:22

标签: javascript jquery

我不想突出显示文字(通过将背景颜色更改为黄色 - 否),我只想在textarea中选择文本的一部分,就像用户点击并按住点击然后将鼠标移动到仅突出显示文本的一部分

怎么做?有可能吗?

3 个答案:

答案 0 :(得分:7)

http://help.dottoro.com/ljtfkhio.php

示例1与您的案例相关:

        function Select () {
            var input = document.getElementById ("myText");
            if (input.selectionStart === undefined) {   // Internet Explorer
                var inputRange = input.createTextRange ();
                inputRange.moveStart ("character", 1);
                inputRange.collapse ();
                inputRange.moveEnd ("character", 1);
                inputRange.select ();
            }
            else {      // Firefox, Opera, Google Chrome and Safari
                input.selectionStart = 1;
                input.selectionEnd = 2;
                input.focus ();
            }
        }

答案 1 :(得分:2)

在非IE浏览器中,这很简单:您可以设置textarea的selectionStartselectionEnd属性的值,或使用setSelectionRange()函数(虽然我从来没有明确为什么存在这种方法:似乎没必要)。然而,在IE中,它有点复杂。这是一个跨浏览器的功能:

var setInputSelection = (function() {
    function offsetToRangeCharacterMove(el, offset) {
        return offset - (el.value.slice(0, offset).split("\r\n").length - 1);
    }

    return function(el, startOffset, endOffset) {
        el.focus();
        if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") {
            el.selectionStart = startOffset;
            el.selectionEnd = endOffset;
        } else {
            var range = el.createTextRange();
            var startCharMove = offsetToRangeCharacterMove(el, startOffset);
            range.collapse(true);
            if (startOffset == endOffset) {
                range.move("character", startCharMove);
            } else {
                range.moveEnd("character", offsetToRangeCharacterMove(el, endOffset));
                range.moveStart("character", startCharMove);
            }
            range.select();
        }
    };
})();

var textarea = document.getElementById("foo");

// Select the text between the second and third characters inclusive
setInputSelection(textarea, 1, 3); 

答案 2 :(得分:0)

你可以使用这个插件

http://www.dennydotnet.com/post/TypeWatch-jQuery-Plugin.aspx

在用户“完成”键入后,您有一个回调函数,还有更多东西......