2012-11-11 9 views
5

Sto scrivendo un plug-in per TinyMCE e voglio usare jQuery per eseguire alcune manipolazioni sul documento che viene editato.Utilizzare jQuery in un plug-in TinyMCE

Non sto cercando un modo per utilizzare TinyMCE con jQuery (ad esempio un metodo .tinymce() su un selettore), so che ci sono soluzioni per questo.

Fondamentalmente ho bisogno di includere jQuery nell'iframe generato da TinyMCE.

tinymce.dom.ScriptLoader sembra caricare nella finestra padre, non nell'iframe, quindi non è un'opzione.

Quello che ho provato finora:

  • carico jquery attraverso ScriptLoader nel genitore e plug-in contesto (quest'ultima non ha alcun effetto a tutti, gli ex lo carica nel contesto sbagliato)
  • Accedi a window.parent. $, Che non è definito (anche se è caricato nella finestra principale)
  • RTFM'ing e googling ma nessun hit rilevante. Se il plug-in apre una finestra di dialogo, c'è un'opzione per caricare javascript aggiuntivi, ma non è quello che mi serve.

Chiunque usi jQuery nei plugin TinyMCE? Come?

Aggiornamento/solutution

Grazie al suggerimento di Thariama sono stato in grado di ottenere questo al lavoro. Puoi usare un esplicito tinymce.get() per ottenere l'editor, o l'istanza 'ed' passata al metodo init() del tuo plugin. Si scopre comunque che nella fase iniziale non è (ancora) possibile accedere al genitore in questo modo. Puoi farlo in un gestore specifico.

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

risposta

4

E 'facile

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

jQuery è acessible utilizza

editor.getWin().parent.jQuery 
+0

grazie! È la combinazione di getWin() e/o lo stadio appropriato quando chiamarlo - vedi l'aggiornamento in post. –

-3

Bene come per la mia esperienza dice che non si può fare qualsiasi JS o modifiche jQuery per un IFrame, quindi questa cosa non è possibile.

+0

si può fare manupulation base DOM in un plugin TinyMCE, non vedo il motivo per cui non si può fare che con jQuery –

+0

Non ne ho idea adesso. Ma sembra che jQuery costruisca il suo albero una sola volta e non includa il codice iframe. Infatti incluso jQuery all'inizio dell'iframe analizzerà il DOM interno (dom dell'iframe), e funziona –