Chrome版本58的编辑器编辑器文本格式问题

Question

我们正在使用ReDactor(https://imperavi.com/redactor/(版本10.1.1，并且由于对项目的很多依赖性而未迁移到Reclactor II。

最近，我们面临着Chrome版本58的非常奇怪的问题。问题是：

- 无法格式化粗体，斜体，下划线，SUP，SUB等

请让我们知道是否有任何解决方案。任何类型的帮助都将不胜感激。

根据接受解决方案的工作更新：

// Provided solution is tested for Redactor version 10.1.1
createMarkers: function()
{
    this.selection.get();
    var node1 = this.selection.getMarker(1);
    this.selection.setMarker(this.range, node1, true);
    if (this.range.collapsed === false) {
        var node2 = this.selection.getMarker(2);
        this.selection.setMarker(this.range, node2, false);
        // Fix for Chrome58 Issues
        if (this.utils.browser('chrome')) {
              this.caret.set(node1, 0, node2, 0);
         }
         // End Chrome58 Issues
    }
    this.savedSel = this.$editor.html();
},

Answer 1

我想我可能已经找到了解决方案：似乎Chrome 58(有时(在我们调用Range.insertNode时重置选择。

我建议的解决方案是在编辑器添加选择标记时还原选择：在createMarkers功能中，设置node2标记后，您可以添加此功能调用： this.caret.set(node1, 0, node2, 0);

这是解决混凝土5修复器的解决方案(但也应该适用于其他项目(。

Answer 2

而不是在10.2.5版本

中

总的来说，您可以这样做：重写setmarker函数：

   setMarker: function (range, node, type) {
          var nclone = window.getSelection().getRangeAt(0).cloneRange();
          range = range.cloneRange();
          try {
            var selection = window.getSelection();
            range.collapse(type);
            range.insertNode(node);
            selection.removeAllRanges();
            selection.addRange(nclone);
          }
          catch (e)
          {
            this.focus.setStart();
          }
        },

或添加fixemarkers函数中的修复：//提供的解决方案已针对编辑器版本10.1.1

测试

createMarkers: function()
    {
      this.selection.get();
      var node1 = this.selection.getMarker(1);
      this.selection.setMarker(this.range, node1, true);
      if (this.range.collapsed === false)
      {
        var node2 = this.selection.getMarker(2);
        this.selection.setMarker(this.range, node2, false);
        // Fix for Chrome58 Issues
        if (this.utils.browser('chrome')) {
              this.caret.set(node1, 0, node2, 0);
         }
         // End Chrome58 Issues
      }
      this.savedSel = this.$editor.html();
    },

这在Chrome 60上工作并测试。

Answer 3

原始代码在10.2.2和10.2.5

中都像这样。

    getNodes: function()
                    {
                        this.selection.get();
                        var startNode = this.selection.getNodesMarker(1);
                        var endNode = this.selection.getNodesMarker(2);
                        if (this.range.collapsed === false)
                        {
                            if (window.getSelection) {
                                var sel = window.getSelection();
                                if (sel.rangeCount > 0) {
                                    var range = sel.getRangeAt(0);
                                    var startPointNode = range.startContainer, startOffset = range.startOffset;
                                    var boundaryRange = range.cloneRange();
                                    boundaryRange.collapse(false);
                                    boundaryRange.insertNode(endNode);
                                    boundaryRange.setStart(startPointNode, startOffset);
                                    boundaryRange.collapse(true);
                                    boundaryRange.insertNode(startNode);
                                    // Reselect the original text
                                    range.setStartAfter(startNode);
                                    range.setEndBefore(endNode);
                                    sel.removeAllRanges();
                                    sel.addRange(range);
                                }
                            }
                        }
                        else
                        {
                            this.selection.setNodesMarker(this.range, startNode, true);
                            endNode = startNode;
                        }
how to change it?