代码之家  ›  专栏  ›  技术社区  ›  Tatu Ulmanen

在Internet Explorer中设置文本区域选择

  •  14
  • Tatu Ulmanen  · 技术社区  · 15 年前

    我在找一个方法 设置 Internet Explorer文本区域中的选定内容。在其他浏览器中,这样做很好:

    textarea.selectionStart = start;
    textarea.selectionEnd = end;
    

    在IE中,我想我必须使用 createRange 以某种方式调整选择,但我不知道怎么做。

    链接到适当文档的额外奖励点数 创世记 以及相关的方法,msdn没有太大帮助。

    4 回复  |  直到 8 年前
        1
  •  18
  •   watain    15 年前

    这对我很有用:

    <textarea id="lol">
    noasdfkvbsdobfbgvobosdobfbgoasopdobfgbooaodfgh
    </textarea>
    
    <script>
    var range = document.getElementById('lol').createTextRange();
    range.collapse(true);
    range.moveStart('character', 5);
    range.moveEnd('character', 10);
    range.select();
    </script>
    

    有用链接:

    msdn上的movestart(): http://msdn.microsoft.com/en-us/library/ms536623%28VS.85%29.aspx

    msdn上的moveend(): http://msdn.microsoft.com/en-us/library/ms536620%28VS.85%29.aspx

        2
  •  17
  •   Rafael    15 年前

    尝试用

    function select(e, start, end){
         e.focus();
         if(e.setSelectionRange)
            e.setSelectionRange(start, end);
         else if(e.createTextRange) {
            e = e.createTextRange();
            e.collapse(true);
            e.moveEnd('character', end);
            e.moveStart('character', start);
            e.select();
         }
    }
    select(document.getElementById('textarea_id'), 5, 10);
    
        3
  •  6
  •   Sam    8 年前

    正如已经评论过的,move方法将行分隔符看作一个字符( \n )而不是两个( \r\n )我已经调整了程序来弥补这一点:

    function select(el, start, end) {
        el.focus();
    
        if (el.setSelectionRange) { 
            el.setSelectionRange(start, end);
        } 
        else { 
            if(el.createTextRange) { 
                var normalizedValue = el.value.replace(/\r\n/g, "\n");
    
                start -= normalizedValue.slice(0, start).split("\n").length - 1;
                end -= normalizedValue.slice(0, end).split("\n").length - 1;
    
                range=el.createTextRange(); 
                range.collapse(true);
                range.moveEnd('character', end);
                range.moveStart('character', start); 
                range.select();
            } 
        }
    }
    
        4
  •  0
  •   johan yong    14 年前

    当心行分隔符,move*方法将它们视为一个字符,但实际上它们是两个-\r\n