如何在没有类属性的情况下使用Rangy.js创建标记

How can I create tags using Rangy.js without a class attribute?

本文关键字：Rangy js 创建 情况下 属性      更新时间：2024-02-29

我一直在为选择范围玩Rangy.js，到目前为止我真的很喜欢它。我想把选择范围的文本节点包装在某个标签中，并在点击按钮时切换它。我使用cssClassApplierModule让它工作得很好，除了（由于名称的原因，这是有意义的）我还必须给dom元素一个它自己应用的类。

所以现在，当我选择一个范围并应用一个强标签时，我的最终结果是：

Text text text <strong class="test"> selected text </strong> text text text

我希望它是：

Text text text <strong> selected text </strong> text text text

到目前为止，我的代码如下：

function gEBI(id) {
                return document.getElementById(id);
            }
            var action;
            function toggleAction() {
                action.toggleSelection();
            }
            rangy.init();
            // Enable buttons
            var cssClassApplierModule = rangy.modules.CssClassApplier;
            // Next line is pure paranoia: it will only return false if the browser has no support for ranges,
            // selections or TextRanges. Even IE 5 would pass this test.
            if (rangy.supported && cssClassApplierModule && cssClassApplierModule.supported) {
                action = rangy.createCssClassApplier("test", {
                    elementTagName: "strong",
                    elementProperties: { }
                });
                var toggleActionButton = gEBI(nsID);
                toggleActionButton.disabled = false;
                toggleActionButton.ontouchstart = toggleActionButton.onmousedown = function () {
                    toggleAction();
                    return false;
                };
            }

我尝试了"和null而不是"text"作为传递的css类，它会切换，但不再关闭，这显然不是正确的解决方案。

感谢任何帮助。。谢谢

不幸的是，Rangy的CSS类应用程序不允许您这样做。根本问题是，它依赖于CSS类来决定围绕哪些元素和文本节点或从中添加/删除类。检测类的存在比检测样式（如大胆）的更一般情况要简单得多。

去年，我做了一些工作，开发了一个更具雄心和通用性的execCommand模块，可以随心所欲。它已经到了一个工作演示的地步，但我陷入了棘手的边缘案例，并停止了它的工作。我确实打算回到它，但可能需要几个月的时间才能准备好。

相关文章：