tinyMCE rimuovi/disabilita i commutatori di ridimensionamento

Question

tinyMCE aggiunge quelli move and resize handles ad alcuni dei miei elementi (non solo le immagini).

Mi piacerebbe liberarmene tutti insieme ma non ho avuto successo.

questi non ha funzionato per me

tinyMCE.init({ 

    object_resizing : false 

}); 

sembra che dovrebbe essere facile reale.

OK, quindi sembra che aggiunga il resize js a qualsiasi elemento posizionato in modo assoluto. se questo aiuta chiunque abbia una risposta.

ho appena provato a rimuoverlo ma ho bisogno di posizionarlo per fare quello che mi serve.

Answer 1

nel tag body del tuo editor è un attributo contenteditable="true". questo è ciò che aggiunge quegli irritanti elementi di ridimensionamento.

se si imposta questo attributo su false non sarà possibile modificare nulla.

quello che devi fare è impostare un listener onMouseDown. se l'utente fa clic sugli elementi in questione ... impostalo su contenteditable="false". se c'è un altro elemento, impostalo su contenteditable="true".

provare questo ...

(function() { 

    tinymce.create('tinymce.plugins.yourplugin', { 

     init : function(ed, url) { 

      ed.onMouseDown.add(function(ed, e) {  

       var body = ed.getBody(); 

       if(jQuery(e.target).hasClass('target-in-question')) { 

        jQuery(body).attr({'contenteditable': false}) 

        // and whatever else you want to do when clicking on that element 

       }else { 
        jQuery(body).attr({'contenteditable': true}) 
       } 

      }); 

     }, 

     createControl : function(n, cm) { 

      return null; 

     }, 

    }); 

    tinymce.PluginManager.add('yourplugin', tinymce.plugins.yourpluginl); 

})(); 

Answer 2

Rimozione jQuery, e rendendo il lavoro la risposta cheez la di weez per la versione TinyMCE 4. Utilizzare questo in un plugin, nel codice di inizializzazione, o semplicemente nella tua pagina dopo si crea un'istanza l'editor

// var editor = your tinyMCE editor instance (e.g. tinymce.activeEditor) 

editor.on('mousedown', function(e) { 

     var element = e.target, 
      body = editor.dom.doc.body; 

     if (editor.dom.hasClass(element, 'your-class')) { 
      editor.dom.setAttrib(body,'contenteditable',false); 
     } else { 
      editor.dom.setAttrib(body,'contenteditable',true); 
     } 
}); 

l'unico sfortunato po 'è che l'utente dovrà cliccare nuovamente dentro l'editor per riprendere la modifica (tasti di direzione non funzionano)