從Textarea中的選定文本創建列表html

Question

我發現了使用jquery將來自textarea的選定文本包裝在html標記中的各種示例，但是當選擇多行文本時，我想稍作修改以創建一個列表。

當前，下面的代碼將整個選擇包裝在列表標記中，但是我也想將所有回車換成列表項目的結束標記和開始標記-因此文本區域中的每一行都是一個新的列表項。

我認為問題之一可能是.val函數將文本區域讀取為一行。

jQuery的：

function listText(elementID, openTag, closeTag) {
    var textArea = $('#' + elementID);
    var len = textArea.val().length;
    var start = textArea[0].selectionStart;
    var end = textArea[0].selectionEnd;
    var selectedText = textArea.val().substring(start, end);
    var replacement = openTag + selectedText + closeTag;
    textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len));
}

$(document).ready(function () {
    $("#BoldIt").click( function() {
        listText("markItUp", "<ul><li>", "</li></ul>");
    });
});

身體：

<textarea id="markItUp" cols="80" rows="20"></textarea>

<br />

<input type="button" value="Bold" id="BoldIt" />

Answer 1

像這樣分割文本：

function listText(elementID, openTag, closeTag) {
    var textArea = $('#' + elementID);
    var s = "\n";
    var len = textArea.val().length;
    var start = textArea[0].selectionStart;
    var end = textArea[0].selectionEnd;
    var selectedText = textArea.val().substring(start, end);
    var replacement = "";

    var rows = selectedText.substring(start, end).split(s);

    for(var i = 0; i < rows.length; i++) {
    replacement += openTag + rows[i] + closeTag + s;
    }

    textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len));
}

$(document).ready(function () {
    $("#BoldIt").click( function() {
    listText("markItUp", "<ul><li>", "</li></ul>");
    });
});