为 tinymce 编辑器设置样式和输入事件

Question

如何为 tinymce 编辑器设置 border 和 border-radius
如何为编辑器设置input事件

这是我的尝试 - 没有成功：

tinymce.init({
selector: "#ed",
autoresize_bottom_margin : 5,
menubar: false,
branding: false,
resize: false,
statusbar: false,
editor_css: "style.css",
plugins: ["lists hr"],
toolbar: false
});

style.css

#ed{
    background:#ddd; // doesn't work        
    border:2px solid #aaa; // doesn't work
    border-radius:14px; // doesn't work
    min-height:54vh; // works
}

js

var ed = $('#ed');
var ed = tinyMCE.activeEditor; // also tried
ed.on('input', function(){
    console.log('lorem'); // doesn't work
});

Answer 1

请尝试使用纯 js 获取选择器，而不是 jquery。

要获取输入，请使用下面的代码段。

tinymce.init({
    selector: 'textarea',  // change this value according to your HTML
    init_instance_callback: function (editor) {
        editor.on('input', function(input){
            //console.log('Element input', input); // get all
            console.log('Element input', input.rangeParent); // get rangeParent
        });
        
    },
        
    // ...
});

tinymce 事件： https://www.tiny.cloud/docs-4x/advanced/events/

为 tinymce 编辑器设置样式和输入事件

set style and input event for tinymce editor

javascript

css

jquery

tinymce