asp.net - 动态注释 HTML？

Question

我想在 Internet Explorer 和 Firefox 的 ASP.NET 页面中执行以下操作:

1. 在窗口中显示上传的 HTML 文档。
2. 允许用户使用标准文本光标突出显示任意部分，然后按“在此发表评论”按钮。
3. 保存突出显示的确切起点和结束点——而不仅仅是突出显示的内容——并将它们与唯一 ID 相关联。
4. 通过覆盖 标记突出显示起点和终点之间的所有内容。

1和2没问题。但是对于 3 和 4... 这可能吗？如果是这样，我该怎么做？

如果 HTML 文档无法做到这一点，那么纯文本呢？ (对于HTML，我们可以假设它比较简单。比如我设想这个支持word文档保存为HTML。)

Answer 1

嗯，你有问题。

假设这段文字:

Hello my
name is
Josh and
this is an
example for you

下面是这样的:

<span>
  Hello my
  <span>
    name is<br/>
    Josh and
  </span>
  <span>
    this is an<br/>
    example for you
  </span>
</span>

然后假设我选择:

Josh and
this is an

我选择的 HTML 是:

  Josh and
</span>
<span>
  this is an

因此，如果您围绕它包装一个 span，您最终会得到一些搞砸了的 HTML。

所以，我会推荐以下内容:

• 用javascript获取选中的文本
• 从所选文本中去除 HTML 标签

你最终得到这个:

function getSelectedTextNoHtml() {
    return getSelectedText().replace(/(<([^>]+)>)/ig, "");
}

function getSelectedText() {
    if (window.getSelection)
        return window.getSelection();
    else if (document.getSelection)
        return document.getSelection();
    else if (document.selection)
        return document.selection.createRange().text;
    return "";
}

然后您可以获取整个文档的 HTML，去除 HTML 标记并在文档的文本版本中找到所选文本的索引。

我什至可以想到(丑陋但可行)在 HTML 中获取选择索引的方法。但我警告你，如果你想要它们，它们很丑。

甚至有一些非常难看的方法可以使用您想要的唯一 ID 在所选文本周围整齐地跨度。当然，总有办法做事。一切都只是一个算法。但这需要好几天的磨练!

我发的已经够多了，如果你想让我详细说明，尽管问!

更新:

好的，你自找的:)

• 获取选定的文本并将其记录在某处
• 用完全独特的内容临时替换所选文本
• 找到那个完全独特的文本的索引
• 改回文字

如果您想在不闪烁和更改文本的情况下谨慎地进行操作，您可以尝试利用 HTML 零宽度空间:

​

在它前面粘贴 100 次，找到 100 个零宽度空格的索引!

当然，如果他们的文档有 100 个零宽度空格和他们在其他地方选择的文本，它会失败，但在这一点上我说“让它失败”:)

怎么样？