6

我正在为 TinyMCE 编写一个插件，我想使用 jQuery 对正在编辑的文档进行一些操作。

我不是在寻找一种将 TinyMCE与jQuery 一起使用的方法（例如，选择器上的 .tinymce() 方法），我知道有解决方案。

基本上我需要在 TinyMCE 生成的 iframe 中包含 jQuery。

tinymce.dom.ScriptLoader 似乎加载在父窗口中，而不是在 iframe 中，所以这不是一个选项。

到目前为止我已经尝试过：

  • 在父和插件上下文中通过ScriptLoader加载jquery（后者完全没有效果，前者加载到错误的上下文中）
  • 访问window.parent.$，它是未定义的（即使它是在父窗口中加载的）
  • RTFM'ing 和谷歌搜索，但没有相关的点击。如果插件打开一个对话框，则可以选择加载其他 javascript，但这也不是我需要的。

有人在 TinyMCE 插件中使用 jQuery 吗？如何？

更新/解决方案

感谢 Thariama 的建议，我能够让它发挥作用。您可以使用显式 tinymce.get() 来获取编辑器，也可以使用传递给插件的 init() 方法的“ed”实例。然而事实证明，在 init 阶段本身你不能（还）以这种方式访问​​父级。您可以在特定的处理程序中执行此操作。

例如

(function($) {
  tinymce.create('tinymce.plugins.SOSamplePlugin', {
    init: function(ed, url) {
        $ = ed.getWin().parent.jQuery; // <- WON'T WORK!

        ed.addCommand('soCmd', function(ui, v) {
            if(e = ed.selection.getNode()) {
                $ = ed.getWin().parent.jQuery; // <- WORKS!
                $(e).wrap('<div class="sample" />');
                ed.execCommand("mceRepaint");
            }
        });
        ed.addButton('SO', {
           title: 'Title',
           cmd: 'soCmd',
           image: 'somebutton.png'
        });
    },
    getInfo: function() {
        return {
            longname: 'Example Plugin',
            author: 'Ivo',
            authorurl: 'http://vanderwijk.info/',
            infourl: 'http://vanderwijk.info',
            version: '1.0'
        };
    }
  });
  tinymce.PluginManager.add('so', tinymce.plugins.SOSamplePlugin);
})($);
4

2 回答 2

4

这很容易

var editor = tinymce.get('your_editor_id');

jQuery 可以使用

editor.getWin().parent.jQuery
于 2012-11-12T09:59:13.637 回答
-3

好吧，根据我的经验，您不能对 IFrame 进行任何 JS 或 jquery 更改，所以这件事是不可能的。

于 2012-11-11T16:56:30.913 回答