setSelectionRange在瀏覽器中的表現方式不一樣嗎？

Question

我發現這是一個不同的問題：

 setCaretToPos = function(input, selectionStart, selectionEnd){
      if(input.setSelectionRange){
        input.focus();
        input.setSelectionRange(selectionStart, selectionEnd);

      }else if(input.createTextRange){
        var range = input.createTextRange();
        range.collapse(true);
        range.moveEnd('character', selectionEnd);
        range.moveStart('character', selectionStart);
        range.select();
      }
    };

 setCaretToPos(8, 12);

它應該從第8個字符和第12個字符之間的文本區域中選擇文本。

它適用於Firefox和Chrome，但在Opera中我選錯了。 偏移移動兩個字符

它出什么問題了？

---

它似乎與新行有關： \\n因為如果文本不包含換行符，則選擇正確。

Answer 1

新行是Opera和IE中textareas中的兩個字符（CRLF或\\r\\n ）和其他瀏覽器中的一個字符（ \\n ）。 你需要調整它。 這是一個執行此操作的功能，將換行符視為所有瀏覽器中的單個字符。

現場演示： http ： //jsfiddle.net/DqtVK/1/

碼：

function adjustOffset(el, offset) {
    var val = el.value, newOffset = offset;
    if (val.indexOf("\r\n") > -1) {
        var matches = val.replace(/\r\n/g, "\n").slice(0, offset).match(/\n/g);
        newOffset += matches ? matches.length : 0;
    }
    return newOffset;
}

var setCaretToPos = function(input, selectionStart, selectionEnd){
  input.focus();
  if(input.setSelectionRange){
    selectionStart = adjustOffset(input, selectionStart);
    selectionEnd = adjustOffset(input, selectionEnd);
    input.setSelectionRange(selectionStart, selectionEnd);

  }else if(input.createTextRange){
    var range = input.createTextRange();
    range.collapse(true);
    range.moveEnd('character', selectionEnd);
    range.moveStart('character', selectionStart);
    range.select();
  }
};