问题
I have a plugin in Wordpress that uses jQuery Resizable to resize dialogs in TinyMCE. There's one <div>
in particular (shown below) that I don't want to be resizable. How do I accomplish this?
This is the outputted <div>
I don't want resizable:
<div class="ui-dialog ui-widget ui-widget-content ui-corner-all wp-dialog ui-draggable ui-resizable" tabindex="-1" role="dialog" aria-labelledby="ui-id-1">
This is the resizable handle's output:
<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se ui-icon-grip-diagonal-se"></div>
I tried these two jQuery functions and neither worked:
$('.ui-dialog').resizable('destroy');
$('.ui-resizable-handle').resizable('destroy');
回答1:
add an onMouseDown handler to check for your DIV via CLASS. if the correct DIV is being clicked, you will need to address the BODY element of the editor.
This took me for ever to find! enjoy
ed.onMouseDown.add(function(ed, e){
var body = ed.getBody();
if(jQuery(e.target).hasClass('someclass')){
jQuery(body).attr({'contenteditable': false})
}else{
jQuery(body).attr({'contenteditable': true})
}
})
回答2:
Make resize impossible by CSS
.defaultSkin .mceStatusbar a.mceResize {
display: none;
}
来源:https://stackoverflow.com/questions/17243512/tinymce-disable-resizable-function-for-specific-div