我使用 Tim 的 Rangy 库来制作一个“简单”的文本编辑器,我为斜体、粗体、删除线和下划线使用静态类,例如:
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();
它工作完美。现在我正在尝试实现前景色和背景色,我考虑过创建一个名为前景的动态样式类,并为用户选择的样式设置文本装饰颜色(来自颜色选择器)或使用预构建类,如
.color1 {
text-decortion-color: red;
}
.color2 {
text-decortion-color: blue;
}
继续..
但通过这种方式,我需要获取选定的文本 CLASSES,而不是迭代并检查它是否已经设置,如果没有,则删除其他设置的颜色,然后添加新的(困难的方式?)
我更喜欢使用类似的东西:
applier = rangy.createClassApplier("f");
applier.text-decoration-color: #000FFF;
但是它不会在我的脑海之外工作哈哈..
如果迭代是“困难的方法”,那么为背景和前景应用颜色的好/最佳方法是什么?
最佳答案
Rangy 的创建者发现并提供了一个很好的方法 ->
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;
}
}
}
关于javascript - Rangy 遍历 getSelection 类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33303233/