编程语言
首页 > 编程语言> > javascript – tinymce – 是否可以从工具栏外调用自定义插件函数?

javascript – tinymce – 是否可以从工具栏外调用自定义插件函数?

作者:互联网

好.我知道以前可能会问这个问题:

Here

但我的问题是如何从外部按钮调用插件函数而不是从工具栏按钮调用.

我添加了一个自定义插件:

tinymce.PluginManager.add('example', function(e) {
        function customfunction(){
                    e.focus(true);
                    alert('Hello TinyMce');
            }
        }
);

Check this on Fiddle

我从其他函数调用此自定义函数,当我单击自定义按钮时调用该函数.
像这样:

function clickme()
{
   tinymce.get('textareaid').plugins.example.customfunction();

}

按钮:

<button onclick="clickme()" >Custom Button</button>

但这对我不起作用?

通过这种方式调用自定义插件功能,我做对了吗?

我错过了什么吗?

解决方法:

一种可能性是向工具栏添加具有唯一ID的按钮,并调用按钮的单击事件.插件看起来像这样:

tinymce.PluginManager.add('example', function(e) {

        function customfunction() {
                    e.focus(true);
                    alert('Hello TinyMce');
            }


        e.addButton('testButton', {
            id: "testButton",
            text: 'Example',
            icon: false,
            onclick: function() {
                    // calls the custom function
                    customfunction();
                }
            });
    }
);

然后初始化tinymce编辑器,如下所示:

tinymce.init({
    selector: "textarea",
    plugins: "example",
    // show the button
    toolbar: "testButton undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});

最后调用按钮点击事件:

function clickme()
{
   document.getElementById("testButton").click();
}

不要使用add_filter.完整的代码形成你的小提琴:

<script type="text/javascript">
tinymce.PluginManager.add('example', function(e) {
        function customfunction() {
                    e.focus(true);
                    alert('Hello TinyMce');
            }


    e.addButton('testButton', {
        id: "testButton",
        text: 'Example',
        icon: false,
        onclick: function() {
                customfunction();
            }
        });
}
);

tinymce.init({
    selector: "textarea",
    plugins: "example",
    toolbar: "testButton undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
//add_filter('mce_external_plugins', 'example');
function clickme()
{
   document.getElementById("testButton").click();
}

</script>

<form method="post" action="">
    <textarea name="content" id="textareaid"></textarea>
</form>

<button onclick="clickme();" >abc</button>

标签:javascript,tinymce-4
来源: https://codeday.me/bug/20190629/1321657.html