在TinyMCE插件中使用jQuery

我正在爲TinyMCE編寫一個插件，我想用jQuery對正在編輯的文檔進行一些操作。我不想要一個方法來使用TinyMCE 與 jQuery（例如選擇器上的.tinymce（）方法），我知道有解決方案。在TinyMCE插件中使用jQuery

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

tinymce.dom.ScriptLoader似乎加載在父窗口中，而不是在iframe中，所以這不是一個選項。

我試過到目前爲止：在家長和插件上下文

負荷的jQuery通過ScriptLoader（後者沒有任何效果可言，在錯誤的情況下前將其加載）
訪問window.parent。$，這是未定義的（即使它在加載在父窗口中）
RTFM'ing和谷歌搜索，但沒有相關的命中。如果插件打開一個對話框，然後有一個選項來加載額外的JavaScript，但這也不是我所需要的。

任何在TinyMCE插件中使用jQuery的人？怎麼樣？

更新/ solutution

由於Thariama的建議我能得到這個工作。您可以使用顯式的tinymce.get（）來獲取編輯器，或者使用傳遞給插件的init（）方法的'ed'實例。然而事實證明，在初始階段本身你不能以這種方式訪問父項。您可以在特定的處理程序中執行此操作。

E.g.

(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); 
})($);

來源

2012-11-11 Ivo van der Wijk

這是

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

jQuery是acessible使用

editor.getWin().parent.jQuery

來源

2012-11-12 09:59:13 Thariama

，謝謝！它是getWin（）和/或何時調用它的適當階段的組合 - 請參閱post中的更新。 –

-3

那麼根據我的經驗，你不能對任何一個IFrame進行JS或jQuery修改，所以這個事情是不可能的。

來源

2012-11-11 16:56:30

容易，你可以在一個在TinyMCE插件做基本的DOM manupulation，我不明白爲什麼你不能這樣做與jQuery –

我現在不知道。但看起來，jQuery只構建一次它的樹，並且不包含iframe代碼。事實上，在iframe開始處包含jQuery將解析內部DOM（iframe的dom），它的工作原理是 –

在TinyMCE插件中使用jQuery

回答

相關問題