Question

我使用Tim的Rangy Library制作一个“简单”的文本编辑器，我使用静态类来表示Italic，Bold，Strike和Underline，如：

myCss.css

.n {
    font-weight: bold;
}

.i {
font-style: italic;
}

.t {
text-decoration: line-through;
}

.s {
    text-decoration: underline;
}

如果我想切换一个特定的类，我只是发送了这个值，所以它将在createClassApplier中使用并将它应用到选择中，如下所示：

applier = rangy.createClassApplier("n");
applier.toggleSelection();

它完美无瑕。现在我试图实现前景色和背景色，我考虑创建一个名为foreground的动态样式类，并为用户选择的那个设置text-decoration-color（从颜色选择器）或使用预构建类，如

.color1 { 
text-decortion-color: red;
}

.color2 { 
text-decortion-color: blue;
}

继续......

但是这样我需要获取所选的文本CLASSES，然后迭代并检查它是否已经设置，如果没有，删除其他设置的颜色而不是添加新的（难的方式？）

我更喜欢使用类似的东西：

applier = rangy.createClassApplier("f");
applier.text-decoration-color: #000FFF;

但是它不会在我的脑海里工作大声笑..

如果迭代是“艰难的方式”，那么为背景和前景应用颜色会有什么好/最好的方法呢？

Answer 1

Rangy的创建者发现并提供了一个好的方法 - ＆gt;

https://stackoverflow.com/a/22528320/2582318

为每个颜色类创建新的应用程序，然后通过它进行迭代以检查是否应用了

var font16Applier = range.createCssClassApplier("font16");
var font17Applier = range.createCssClassApplier("font17");
var font18Applier = range.createCssClassApplier("font18");

var appliers = [font16Applier, font17Applier, font18Applier];

for (var i = 0, len = appliers.length; i < len; ++i) {
    if (appliers[i].isAppliedToSelection()) {
        if (i < len - 1) {
            appliers[i].undoToSelection();
            appliers[i + 1].applyToSelection();
            break;
        }
    }
}

Rangy通过getSelection类迭代

1 个答案: