允許用戶發布內嵌評論

Question

允許用戶在網頁上的文本塊內發布內嵌評論的有效方法是什么？

例如，如果有這樣的文章：

congue eget ipsum。 兼收並蓄的蒙太奇，納斯提爾ridiculus mus。

我希望該網頁的訪問者能夠在某些文本上發表評論，他們可以在其中選擇一些單詞並開始輸入內嵌評論。 擁有單詞索引以使每個單詞都有一個數字將不起作用，因為可以編輯文本，然后單詞編號將不准確。

更改存儲的文本並為每個注釋添加一些標記有什么問題嗎？ 如：

congue eget ipsum。 納塔克大學（Cum sociis natoque） <user:123;comment:123>penatibus et magnis</user:123;comment:123>產婦蒙太奇，無脊椎動物。

這樣，我可以解析文本，然后從數據庫中提取注釋，並以內聯或氣球狀顯示。

有沒有更好的解決方案呢？

Answer 1

首先，更改底層標記不會很好，因為如果內聯注釋重疊，會發生什么？

如果對文本進行編輯以使更改的單詞包含嵌入式注釋，會發生什么情況？

如果沒有更具體的規范，實際上就沒有“完美”的方法。 我建議按照您的建議將注釋存儲為單詞索引。 如果修改了文本，請在舊版本和新版本之間進行比較。 使用此差異，您可以嘗試更新嵌入式注釋的索引，並刪除放置在修改后的文本上的注釋。

Answer 2

我會使用javascript檢索選定的文本，然后計算從開始到選定文本的字符計數位置。 因此，我將在數據庫中存儲注釋，所選內容的“開始”位置和“長度”。 此解決方案的問題在於您無法更改原始文本，因為如果這樣做，則必須更新所有注釋的位置（其中一些注釋可能需要刪除）

那是容易的部分。 困難的部分將是顯示由於@tskuzzy列出的所有問題而引起的評論（重疊的評論）

這是我做的一個小實驗：

http://jsfiddle.net/5jNg9/1/

<div id="content">
congue eget ipsum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
</div>
<input type="button" onclick="checkSelection()" value="Get Selection"/>

<script>
function checkSelection(){
    var text = document.getElementById('content').innerHTML;
    var selection = document.getSelection();
    if(selection == ""){
        alert("cmon' at least select something first!");
    } else{
        var start = text.search(selection);
        alert("selection starts at character: "+ start +
              "\n and ends at character: "+(selection.length + start - 1) + "\n" +
              "the selected text is: '"+selection+"'");
    }
}
</script>