Javascript選擇文本和格式textarea

我想讓用戶在評論系統（窮人的文本編輯器）中使用textarea文本做簡單的格式。希望允許他們用光標選擇文本，然後點擊按鈕進行格式化。我的問題是如何獲得JavaScript來抓取並返回選定的文本。想象一下，它應該是這樣的：Javascript選擇文本和格式textarea

<script> 
function formatText(field) { 
//gets text 
var text; 
text = field.value.substring(field.selectionStart, field.selectionEnd); 
//formats it 
var text = '<b'>+text+'</b>'; 
//returns it 
field.value.substring(field.selectionStart, field.selectionEnd); = text; 
} 
</script> 

<body> 
<textarea id="field"></textarea><button onclick="formatText('field')">Make bold</button> 
</body>

UPDATE：以下代碼獲取選定的文本，格式，然後將其發送回textarea的 - 但是，它取代了textarea的所有文字...所以我只需要辦法在textarea的替代選擇的文本 - 而不是所有 - 我會做：

<head> 
    <script type="text/javascript"> 
     function GetSelection() { 
      var selection = ""; 

      var textarea = document.getElementById("field"); 
      if ('selectionStart' in textarea) { 
        // check whether some text is selected in the textarea 
       if (textarea.selectionStart != textarea.selectionEnd) { 
        selection = textarea.value.substring (textarea.selectionStart, 

textarea.selectionEnd); 
       } 
      } 
      else { // Internet Explorer before version 9 
        // create a range from the current selection 
       var textRange = document.selection.createRange(); 
        // check whether the selection is within the textarea 
       var rangeParent = textRange.parentElement(); 
       if (rangeParent === textarea) { 
        selection = textRange.text; 

       } 
      } 

      if (selection == "") { 
       alert ("No text is selected."); 
      } 
      else { 
       selection = "<b>"+selection+"</b>"; 
     document.getElementById('field').value = selection; 

      } 
     } 
    </script> 
</head> 
<body> 
    <textarea id="field" spellcheck="false">Select some text within this field.</textarea> 
    <button onclick="GetSelection()">Get the current selection</button> 
</body>

我覺得這是指定document.getElementByID.value.substr可能做到這一點的一種方式，但我不」不懂語法。

來源

2012-05-02 user1260310

如果您希望他人幫助您，您可能希望接受您的問題的答案。 –

在你的代碼有以下問題：

var text

每行必須以一個;

<button onclick="formatText("field")">

聖結束arting報價必須以引號結束，如果你需要內報價，即對於像字符串「這是我的文字我要處理」，那麼裏面的引號需要用單引號

onclick="formatText('field')"

text = field.value.substring(field.selectionStart, field.selectionEnd);

代碼將一個字符串傳遞給函數，該函數沒有value屬性\ method。我們希望文本字段中的文本，所以我們使用「元素」，它使用document.getElementById('field')

然後，我們只是樣式該元素將做的伎倆。

如果你需要替換的文字只是值分配給

document.getElementById('field').value = ...

下面是一個例子..

<script type="text/javascript" > 
    function formatText() { 
     //gets text 
     //text = document.getElementById('field').value; 
     //formats it 
     document.getElementById('field').style.fontWeight = "bold"; 
    } 
</script> 

</head> 
<body> 
<textarea id="field"></textarea><button onclick="formatText()">Make bold</button> 
</body>

檢查在這裏http://jsfiddle.net/YcpUs/

來源

2012-05-02 16:00:14

Thx！這是一個非常乾淨的方式來格式化整個textarea。我使用getElementById模擬了我的非工作示例。然而，有沒有辦法讓你選擇的文本在textarea中的光標，即。爲懶惰的狗，大膽的'懶惰'？我找到了領域。選擇開始和領域。selectionEnd方法在這個鏈接：（http://stackoverflow.com/questions/275761/how-to-get-selected-text-from-textbox-control-with-javascript） – user1260310

這就是：窮人的文本編輯器。使用SelectionStart和SelectionEnd應用於textarea中的文本以獲取選定的文本。然後在重新格式化之後，將textarea文本從三個部分放回，在選擇文本，選定文本和選擇文本之前。使用document.getElementById（'textareaid'）。將值放回到textarea中。value =組合文本。

<html> 
<head><script> 
function format() { 
    // code for IE 
    var textarea = document.getElementById("textarea"); 

    if (document.selection) 
    { 
    textarea.focus(); 
    var sel = document.selection.createRange(); 
    // alert the selected text in textarea 
    alert(sel.text); 

    // Finally replace the value of the selected text with this new replacement one 
    sel.text = '<b>' + sel.text + '</b>'; 
    } 

    // code for Mozilla 

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

    var len = textarea.value.length; 
    var start = textarea.selectionStart; 
    var end = textarea.selectionEnd; 
    var sel = textarea.value.substring(start, end); 

    // This is the selected text and alert it 
// alert(sel); 

    var replace = '<b>' + sel + '</b>'; 

    // Here we are replacing the selected text with this one 
    textarea.value = textarea.value.substring(0,start) + replace + textarea.value.substring(end,len); 

var formatted = textarea.value; 
document.getElementById('field').value = formatted; 
} 

</script></head> 
<body> 
<textarea id="textarea">One two three four five six seven eight</textarea><button onclick="format 

()">Format selected text</button> 
</body> 
</html>

來源

2012-05-03 02:06:55 user1260310

Javascript選擇文本和格式textarea

回答

相關問題