javascript - CKeditor 自己的带对话框的插件

Question

我已经编写了自己的插件来生成一个简单的链接。 奇怪的是我不能编辑“href”属性。可以编辑其他属性。

这个元素不起作用:

{
    type: 'text',
    id: 'url',
    label: 'URL',
    commit: function(element) {
        element.setAttribute('href', this.getValue());
    },
    setup: function(element) {
        this.setValue(element.getAttribute('href'));
    }
}

当我创建链接时，会写入 href 属性。当我编辑链接时，“href”属性没有改变。奇怪!

当我更改上面的代码并将属性名称重写为“href-s”时:

{
    type: 'text',
    id: 'url',
    label: 'URL',
    commit: function(element) {
        element.setAttribute('href-s', this.getValue());
    },
    setup: function(element) {
        this.setValue(element.getAttribute('href-s'));
    }
}

创建和编辑属性完美运行。

不知道是什么问题？

谢谢。

Answer 1

由于各种内部原因，CKEditor 在运行时使用data-cke-saved-href 属性复制href。那么输出结果会是什么样子

<p>I&#39;m a <a href="http://foo.com">plain&nbsp;link</a>.</p>

<p>I&#39;m a <a href="mailto:foo@bar.com?subject=Subject&amp;body=Body">mailto link</a>.</p>

实际上在编辑器 DOM 中有些不同

<p>I'm a <a data-cke-saved-href="http://foo.com" href="http://foo.com">plain&nbsp;link</a>.</p>

<p>I'm a <a data-cke-saved-href="mailto:foo@bar.com?subject=Subject&amp;body=Body" href="mailto:foo@bar.com?subject=Subject&amp;body=Body">mailto link</a>.</p>

每次更改 href 时更新 data- 属性，一切都会正常进行。