如何添加標籤到選定的文本，使用javascript

我有一個textarea和裏面我有一些文本輸入。所以，當我選擇從文本區一些文本，然後單擊代碼按鈕，它應該添加<代碼> < /代碼>標記選定文本...

爲了這個，我用這個代碼：

代碼：

<html> 
<head> 
<script type="text/javascript"> 
    function formatText (tag) { 
     var selectedText = document.selection.createRange().text; 

     if (selectedText != "") { 
      var newText = "<" + tag + ">" + selectedText + "</" + tag + ">"; 
      document.selection.createRange().text = newText; 
     } 
    } 
</script> 
</head> 
<body> 

<form name="my_form"> 
    <div id="tarea">askfashfkja;f</div><br /> 
    <input type="button" value="code" onclick="formatText ('code');" /> 
</form> 
</body> 
</html>

但是，這是行不通的...我怎麼能這樣做???

來源

2013-10-15 MintY

@RobG怎麼樣格??? – MintY

JSFiddle在這裏會有所幫助。 – mavrosxristoforos

*無法調用未定義的方法'createRange'*您是否熟悉Web瀏覽器的「開發人員工具」？在大多數瀏覽器中，按「F12」，您將獲得開發人員工具，「控制檯」選項卡將顯示javascript錯誤（如上面的錯誤）。 – Snixtor

從這個例子嘗試的功能：

<script type="text/javascript"> 
// Function to add <tag>To Selected text</tag> in textarea with id of idelm 
// Receives the tag name, and the id of textarea. 
// Returns the selected text, with tag 
function addTagSel(tag, idelm) { 
    // http://CoursesWeb.net/javascript/ 
    var tag_type = new Array('<', '>');  // for BBCode tag, replace with: new Array('[', ']'); 
    var txta = document.getElementById(idelm); 
    var start = tag_type[0] + tag + tag_type[1]; 
    var end = tag_type[0] +'/'+ tag + tag_type[1]; 
    var IE = /*@[email protected]*/false; // this variable is false in all browsers, except IE 

    if (IE) { 
    var r = document.selection.createRange(); 
    var tr = txta.createTextRange(); 
    var tr2 = tr.duplicate(); 
    tr2.moveToBookmark(r.getBookmark()); 
    tr.setEndPoint('EndToStart',tr2); 
    var tag_seltxt = start + r.text + end; 
    var the_start = txta.value.replace(/[\r\n]/g,'.').indexOf(r.text.replace(/[\r\n]/g,'.'),tr.text.length); 
    txta.value = txta.value.substring(0, the_start) + tag_seltxt + txta.value.substring(the_start + tag_seltxt.length, txta.value.length); 

    var pos = txta.value.length - end.length; // Sets location for cursor position 
    tr.collapse(true); 
    tr.moveEnd('character', pos);  // start position 
    tr.moveStart('character', pos);  // end position 
    tr.select();     // selects the zone 
    } 
    else if (txta.selectionStart || txta.selectionStart == "0") { 
    var startPos = txta.selectionStart; 
    var endPos = txta.selectionEnd; 
    var tag_seltxt = start + txta.value.substring(startPos, endPos) + end; 
    txta.value = txta.value.substring(0, startPos) + tag_seltxt + txta.value.substring(endPos, txta.value.length); 

    // Place the cursor between formats in #txta 
    txta.setSelectionRange((endPos+start.length),(endPos+start.length)); 
    txta.focus(); 
    } 
    return tag_seltxt; 
} 
</script> 

<form name="my_form"> 
    <textarea name="my_textarea" id="my_textarea">Sometext, abcd ... xyz, 123.</textarea><br /> 
    <input type="button" value="code" onclick="addTagSel('tag', 'my_textarea');" /> 
</form>

來源

2013-10-15 06:08:47 CoursesWeb

如何添加標籤到選定的文本，使用javascript

回答

相關問題