问题标签 [rangy]

我有这个问题，我试图在这个 jsFiddle中展示。我有 contenteditable ，其中是简单的 html - 只有文本和一个<B>元素。我的问题是关于插入符号位于<B>元素内部某处并且用户点击“X”键的情况。然后<B>元素成功展开，但插入符号改变位置并移动到展开<B>元素的开头。

我希望插入符号不改变其位置并保持在 samoe 位置。可能吗 ？最好使用Rangy 库来解决？

出于这个问题的目的，代码被简化：

我正在尝试查找已保存的范围选择的 markerId 值。

我尝试了以下方法：

但它返回“未定义”。直接输出marker变量会返回一个明确有“markerId”作为item的对象。我似乎无法到达多维对象中的第三维。

怎么可能做到这一点？

我正在使用很棒的Rangy 库。而且我还使用 Tim Down 的函数将 HTML 节点插入到 contenteditable DIV 中：

现在，这在 Chrome 中可以正常工作并且符合预期。然而在 FF 和 Opera 中存在不同的行为。在 Chrome 中，HTML 节点插入到 contenteditable 中，插入符号保留在此 HTML 节点中，因此当用户继续输入时，他所有的输入都在插入的 HTML 节点中。

在 Opera 和 Firefox 中，插入符号位于插入的 HTML 节点之外，当用户继续输入时，输入的字符不在 HTML 节点内。

我的代码需要“Chrome 方式”的工作方式。您能帮我在 FF 和 Opera 中实现相同的行为吗？

用于测试的工作 jsFiddle 在这里：http: //jsfiddle.net/Er5DH/2/（当您在 contenteditable 中按“x”键时，它会插入红色的 SPAN 元素。在 Chrome 中，当您继续输入字符时，字符为红色，如预期。但在 FF 和 Opera 中，“x”键按下后的下一个键入的字母是黑色的 - 不需要）

感谢您的任何帮助和提示。

在另一个元素的开头（管道 | 是插入符号位置）尝试在空元素之前插入节点时，我注意到了这个问题。从此开始：

我在 Rangy 范围上使用 range.insertNode() 来粘贴一些文本，但在 Chrome 中我看到了这个结果，新节点出现在空之后<span>：

而不是这样：

请注意，这在 IE9 中似乎可以正常工作，并且如果插入未在<p>节点的开头完成，它也可以在 Chrome 中工作，例如：

结果是：

这是一个简化的示例，但显示了我看到的问题。

为了澄清（如果我以错误的方式处理这个问题，有人可以提出替代方案）我正在尝试插入文本，并且一旦插入完成，光标总是出现在新插入文本的末尾。

例如<p>|Original Text</p>应该成为<p>INSERTED TEXT|Original Text</p>

但是，插入节点会导致插入符号紧挨在插入的文本之前放置（正如文档所述，它应该用于插入节点，因此没有抱怨）。我试图在插入后使用空<span>作为标记来恢复插入符号的位置（实际上我正在使用 Rangy 的选择保存和恢复模块来为我做这件事）。

我将如何在某个位置（选择）拆分节点/元素。

示例我有这个标记：

（这个管道代表位置/选择）

我想将其转换为：

维护选择。

有任何想法吗？

我使用 Rangy 库和 jQuery，但如果适用，可以使用原始 JS。

我正在使用 rangy 选择 IFrame 选择中的文本，但有时我需要滚动 IFrame 才能查看此选择。是否可以自动将 IFrame 滚动到选定的文本？

我正在考虑在网页上实现一个简单的 2 按钮切换，以在具有 H1 标题和 H2 之间切换一些选定的文本。环绕内容方法效果很好，但是我在尝试替换现有的父标记元素节点时遇到了问题。我已经尝试了各种尝试做到这一点的方法，但没有取得太大的成功。

基本功能如下。使用相同的选定文本并一个接一个地运行这两个函数将产生一些输出，如下所示：

选择“测试文本”的文本后，然后选择 H1 选项： <h1>test text</h1>

如果再次选择相同的文本并且这次按下 H2 选项：<h1><h2>test text</h2></h1>

这很好，并且可以预期，但我真的在寻找一种方法来删除原始父标题元素，以便标题元素不会嵌套（例如 - 文本被 h1 或 h2 包围，而不是两个都）。我确实尝试访问 parentNode 等，但没有设法使这种方法发挥作用。我已经尝试查看以下 parentElement 建议使用 rangy 库获取所选文本的父节点但是我无法让 rangy 将更改的父元素写回 DOM 或有一种令人满意的方式来确定 DOM 中的位置对象是为了替换它。它很快就变成了一种笨拙的方法，必须有更好的选择。

我知道 rangy CssApplier 模块可以处理这种情况，但我需要使用实际元素而不是 css。

我还注意到，在使用 rangy 进行文本编辑器实现的 raptor 编辑器上，在应用标题时会遇到完全相同的问题：http ://www.raptor-editor.com/demo

这个问题也很相关，但据我所知，execCommand 无法处理这个特定的元素问题 - Javascript: how to un-surroundContents range

亲切地接受任何帮助或建议。

如何选择文本并使用 获取所选文本Rangy？例如，如果我想构建一个类似于 Stack Overflow 上的文本编辑器，如果我选择一段文本并单击B按钮，则该文本将替换为文本前后的两个星号。

我知道底层 Javascript 必须捕获所选文本的偏移量，通过星号添加和附加该文本，并输出替换先前所选文本的新文本。我该如何做到这一点？原生 DOM 3setSelection方法提供了一些功能，但这些不是高度跨浏览器兼容的，而是Rangy跨浏览器。不幸的是，Rangy 的文档很差。

我制作了一个带有一些清理逻辑的小内联编辑器。因此，如果您从 word 文件中粘贴，它会删除所有格式。

我的问题是，如果您选择例如一个句子并粘贴，它不会被替换。这与清理逻辑有关。现在我需要知道，如何使用 rangy 删除范围，以便在粘贴之前删除该范围。

http://jsfiddle.net/eJNKy/3/

这是一个后续问题。我一直在尝试使用 rangy 从 iframe 中获取选定的文本。该代码似乎适用于非 iframe 内容。根据rangy 的文档，它应该可以工作。

这是演示：http: //jsfiddle.net/codef0rmer/UuJ5G/