tinyMCE去除/禁用大小调整切换

Question

tinyMCE在一些元素上（不仅仅是图片）添加了“移动和调整大小手柄”。

我希望完全摆脱它们，但我没有成功。

这些方法对我都没有用。

tinyMCE.init({

   object_resizing : false

});

这似乎应该很容易。

好的，看起来它将resize js添加到所有绝对定位的元素中。如果这对回答有帮助的话。

我刚试图将其移除，但我需要定位它以实现我的需求。

- 100pwd

Answer 1

移除jQuery，并使cheez la weez的答案适用于TinyMCE版本4。将其用于插件中、在初始化代码中或仅在您实例化编辑器后在页面上使用。

// 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);
        }
});

唯一不利的是，您的用户将必须点击回编辑器才能继续编辑（箭头键无法使用）。

- Nic

Answer 2

在你的编辑器的body标签中，有一个属性 contenteditable="true" 。它会添加那些讨厌的调整元素。

如果您将该属性设置为 false ，则将无法编辑任何内容。

您需要做的是设置一个 onMouseDown 监听器。如果用户单击相关元素...将其设置为 contenteditable =“false”。如果单击的是其他元素，则将其设置为 contenteditable =“true”。

尝试这个...

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

})();

- cheez la weez

---

现在它是 resize: false。 - Tiny