在Textarea文本选择中添加粘滞便笺

Question

我有文字区域，我想在其上显示粘滞便笺以撰写评论，并在粘贴笔记上单击它应突出显示相关的选定文本下面是显示粘贴笔记和文本区域的代码，用于选择文本和评论按钮单击事件我是获取所选文本但无法将所选文本与粘滞便笺链接，并且无法在每次评论时显示备注

Sticky Notes Fiddle

＆＃13;

＆＃13;

function ShowSelection() {
    var textComponent = document.getElementById('textArea');
    var selectedText;
    // IE version
    if (document.selection != undefined) {
        textComponent.focus();
        var sel = document.selection.createRange();
        selectedText = sel.text;
    }
    // Mozilla version
    else if (textComponent.selectionStart != undefined) {
        var startPos = textComponent.selectionStart;
        var endPos = textComponent.selectionEnd;
        selectedText = textComponent.value.substring(startPos, endPos)
    }
    alert("You selected: " + selectedText);
    
}

＆＃13;

<div><textarea class="Test" id="textArea" style="width: 300px; height: 300px;">Hello</textarea></div>
<input type="button" value="Comment" />

＆＃13;

＆＃13;

＆＃13;