CKEditor:调用没有工具栏按钮的插件函数 [英] CKEditor: call a plugin function without toolbar button

查看:91
本文介绍了CKEditor:调用没有工具栏按钮的插件函数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何在没有工具栏按钮的情况下调用插件函数?



我在cms中集成了一个外部浮动工具栏。我使用CKEditor的InsertHTML()API插入图像,视频和其他静态代码。



现在我还需要从URL插入视频,这真是太棒了插件。



如何在我的配置文件中加载该插件,然后尝试创建此功能:



p>

  function oembed(){
//获取要与之交互的编辑器实例。
var编辑器= CKEDITOR.instances.editor1;
var url ='http://www.youtube.com/watch?v=AQmbsmT12SE'
var wrapperHtml = jQuery('< div />').append(editor.config.oembed_WrapperClass != null?'< div class ='+ editor.config.oembed_WrapperClass +' />':'< div />');;

//检查活动的编辑模式。
if(editor.mode ==‘wysiwyg’)
{
//插入HTML代码。
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertHtml
editor.embedCode(url,editor,false,wrapperHtml,650,400,false) ;
}
其他
警报(您必须处于所见即所得模式!);

}



结果是这样的:



未捕获的TypeError:对象[object Object]没有方法'embedCode'



有什么方法可以创建



EDIT



这样的新API,例如 InsertHTML可以调用没有工具栏按钮的插件函数吗?

也许我可以使用createFakeElement API。



http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-createFakeElement



我将类fakegallery添加到我的文档中。



我使用此代码,但没有任何反应:

 函数Fake()
{
var editor = CKEDITOR.instances.editor1;
var element = CKEDITOR.dom.element.createFromHtml(’< div class = bold>< b> Example< / b>< / div>’);
alert(element.getOuterHtml());
editor.createFakeElement(element,'fakegallery','div',false);

}


解决方案

我发现了这篇文章寻找答案...



在此处查看答案中提供的链接[ http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-fire ],向下滚动到execCommand



这对我有用,只需要您知道插件的名称即可,它将始终有效。显然,您可能需要将 editable更改为编辑器实例。

  CKEDITOR.instances ['editable']。execCommand( 'YOUR_PLUGIN_NAME_HERE'); 

如果上述操作失败,则 HACK



这可以工作(下面的第一行代码),但是要求您查看源代码以找到正确的#。如果您有1个自定义插件,没什么大不了的。但是,如果像我这样有十几个或更多的人,这很烦人,并且可能会随着添加更多插件而改变。

  CKEDITOR .tools.callFunction(145,this); 

希望这会有所帮助!


How can I call a plugin function without a toolbar button?

I have an external floating toolbar integrated in my cms. I insert images, videos and other pieces of static code with the InsertHTML() API of CKEditor.

Now I need to insert also video from URL, and there is the fantastic oembed plugin. How can I fire that plugin using a button in my cms without the toolbar button?

I load the plugin in my config, and I try to create this function:

function oembed() {
// Get the editor instance that we want to interact with.
var editor = CKEDITOR.instances.editor1;
var url = 'http://www.youtube.com/watch?v=AQmbsmT12SE'
var wrapperHtml = jQuery('<div />').append(editor.config.oembed_WrapperClass != null ? '<div class="' + editor.config.oembed_WrapperClass + '" />' : '<div />');

// Check the active editing mode.
if ( editor.mode == 'wysiwyg' )
{
    // Insert HTML code.
    // http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertHtml
    editor.embedCode(url, editor, false, wrapperHtml, 650, 400, false);
}
else
    alert( 'You must be in WYSIWYG mode!' );

}

The result is this:

Uncaught TypeError: Object [object Object] has no method 'embedCode'

Is there any way to create a new API like "InsertHTML" to call plugin functions without toolsbar buttons?

EDIT

Maybe I can use the createFakeElement API.

http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-createFakeElement

I add the class fakegallery to my doc.

I use this code but nothing happens:

      function Fake()
   {
      var editor = CKEDITOR.instances.editor1;
      var element = CKEDITOR.dom.element.createFromHtml( '<div class="bold"><b>Example</b></div>' );
      alert( element.getOuterHtml() ); 
      editor.createFakeElement( element, 'fakegallery', 'div', false );

   }

解决方案

I found this post looking for the answer...

Checked out the link provided in the answers here [ http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-fire ], scrolled down to execCommand

This worked for me and only requires that you know the name of your plugin, so it'll always work. Obviously, you may need to change "editable" to your editor instance.

CKEDITOR.instances['editable'].execCommand('YOUR_PLUGIN_NAME_HERE');

If above fails, HACK:

This would work (first line of code below), but requires you to look at the source to find the correct #. If you have 1 custom plugin, no big deal. But if you have a dozen or more, like me, this is annoying, and could change as more plugins are added.

CKEDITOR.tools.callFunction(145,this);

Hope this helps!

这篇关于CKEditor:调用没有工具栏按钮的插件函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆