0

我想在 WordPress 的 TinyMCE 编辑器中添加一个自定义元素。

在可视模式下，它应该如下所示：在此处输入图像描述

在文本模式下，它应该是：<!-- example -->

该元素被插入到页面内容中，如下所示：

tinyMCE.execCommand('insertElement', false)   # 'insertElement' is defined below

当此代码在可视模式下运行时，图像被正确插入。

但是，在文本模式下运行此代码不会产生任何结果（<!-- example -->不出现）。

这是为什么？

这是 TinyMCE 代码本身：（CoffeeScript）

(($) ->
  tinymce.PluginManager.requireLangPack('example')

  tinymce.create 'tinymce.plugins.ExamplePlugin',
    init: (ed, url) ->
      elementHTML = '<img class="example" src="http://goo.gl/eejO0" />'

      ed.addCommand 'insertElement', ->
        ed.execCommand('mceInsertContent', false, elementHTML)

      ed.onPostProcess.add (ed, o) ->
        if o.get
          $wrapper = $('<div />').html(o.content)

          $('.example', $wrapper).each ->
            $(this).replaceWith("<!-- example -->")

          o.content = $wrapper.html()

      ed.onBeforeSetContent.add (ed, o) ->
        if o.content
          o.content = o.content.replace(/<!-- example -->/g, elementHTML)
    ,
    getInfo: ->
      longname: 'Example Plugin'
      author: 'Me'
      authorurl: 'http://mysite.com'
      infourl: 'http://mysite.com'
      version: '1.0'

  tinymce.PluginManager.add('example', tinymce.plugins.ExamplePlugin)
) jQuery
4

2 回答 2

1

我猜在 textmode 中没有真正的 tinymce 编辑器，而只是一个普通的 textarea。

于 2013-04-29T09:12:05.267 回答
0

我不确定这是否是您要寻找的，但这是我的解决方案。

<h1><img alt="" src="http://static.tinymce.com/tinymce/js/4.0b2/plugins/emoticons/img/smiley-yell.gif" /></h1>
&nbsp;
<h1><img alt="" src="http://static.tinymce.com/tinymce/js/4.0b2/plugins/emoticons/img/smiley-smile.gif" data-mce-selected="1" /></h1>

希望没事！

于 2013-04-26T12:14:45.640 回答