如何使用javascript

Question

Possible Duplicate:
Inserting a text where cursor is using Javascript/jquery

我在這裏構建一個簡單的模板系統中的光標位置文本添加到文本區域。基本上我已經設置了將預設變量添加到textarea中的按鈕。

問題是我希望能夠在我的光標所在的位置在我的textarea中添加文本。就像當您點擊編輯器窗口中的URL鏈接以獲取帖子時，鏈接添加到您的光標所在的位置。

我該怎麼做？而且可以使用原型JS完成嗎？

Answer 1

這對IE來說有點棘手，這對於這類事情做得非常糟糕。 （如果選擇了任何文本，或在脫字符號）下面將在當前選擇的在一個textarea或文本輸入端插入文本，然後將文本之後將光標定位：

演示：http://jsfiddle.net/RqTvT/1/

代碼：

function getInputSelection(el) { 
    var start = 0, end = 0, normalizedValue, range, 
     textInputRange, len, endRange; 

    if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") { 
     start = el.selectionStart; 
     end = el.selectionEnd; 
    } else { 
     range = document.selection.createRange(); 

     if (range && range.parentElement() == el) { 
      len = el.value.length; 
      normalizedValue = el.value.replace(/\r\n/g, "\n"); 

      // Create a working TextRange that lives only in the input 
      textInputRange = el.createTextRange(); 
      textInputRange.moveToBookmark(range.getBookmark()); 

      // Check if the start and end of the selection are at the very end 
      // of the input, since moveStart/moveEnd doesn't return what we want 
      // in those cases 
      endRange = el.createTextRange(); 
      endRange.collapse(false); 

      if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) { 
       start = end = len; 
      } else { 
       start = -textInputRange.moveStart("character", -len); 
       start += normalizedValue.slice(0, start).split("\n").length - 1; 

       if (textInputRange.compareEndPoints("EndToEnd", endRange) > -1) { 
        end = len; 
       } else { 
        end = -textInputRange.moveEnd("character", -len); 
        end += normalizedValue.slice(0, end).split("\n").length - 1; 
       } 
      } 
     } 
    } 

    return { 
     start: start, 
     end: end 
    }; 
} 

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

function setSelection(el, start, end) { 
    if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") { 
     el.selectionStart = start; 
     el.selectionEnd = end; 
    } else if (typeof el.createTextRange != "undefined") { 
     var range = el.createTextRange(); 
     var startCharMove = offsetToRangeCharacterMove(el, start); 
     range.collapse(true); 
     if (start == end) { 
      range.move("character", startCharMove); 
     } else { 
      range.moveEnd("character", offsetToRangeCharacterMove(el, end)); 
      range.moveStart("character", startCharMove); 
     } 
     range.select(); 
    } 
} 

function insertTextAtCaret(el, text) { 
    var pos = getInputSelection(el).end; 
    var newPos = pos + text.length; 
    var val = el.value; 
    el.value = val.slice(0, pos) + text + val.slice(pos); 
    setSelection(el, newPos, newPos); 
} 

var textarea = document.getElementById("your_textarea"); 
insertTextAtCaret(textarea, "[INSERTED]");