CKEditor：調用沒有工具欄按鈕的插件函數

如何在沒有工具欄按鈕的情況下調用插件函數？CKEditor：調用沒有工具欄按鈕的插件函數

我有一個集成在我的cms中的外部浮動工具欄。我使用CKEditor的InsertHTML（）API插入圖像，視頻和其他靜態代碼片段。

現在我需要插入來自URL的視頻，並且還有一個夢幻般的插件。如何在沒有工具欄按鈕的情況下使用我的cms中的按鈕來激活該插件？

我加載在我的配置插件，我嘗試創建此功能：

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!');

}

結果是這樣的：

遺漏的類型錯誤：對象的翻譯：有沒有方法'embedCode'

有沒有什麼辦法可以像「InsertHTML」一樣創建一個新的API來調用沒有工具欄按鈕的插件功能？

編輯

也許我可以用createFakeElement API。

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

我的類fakegallery添加到我的文檔。

我用這個代碼，但沒有任何反應：

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

    }

來源

2013-05-16 Roberto Pezzali

閱讀： http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-fire

editor.fire('MediaEmbed', data);

我認爲這是您的數據需要有結構：

var data = {title : 'Embed Media', 
       minWidth : 550, 
       minHeight : 200, 
       contents : 
         [ 
          { 
          id : 'iframe', 
          expand : true, 
          elements :[{ 
           id : 'embedArea', 
           type : 'textarea', 
           label : 'Paste Embed Code Here', 
           'autofocus':'autofocus', 
           setup: function(element){ 
           }, 
           commit: function(element){ 
           } 
           }] 
          } 
         ]}

我不安全，但這會幫助你的方式。查看插件的源代碼以查找可用命令。上面指定的命令名稱是您插件的唯一名稱。

編輯 - 手動插入

   var div = editor.document.createElement('div'); 
       div.setHtml("<embed src=" + url +" width=" + width +" height=" + height + ">"); 
       editor.insertElement(div);

您可以添加每個屬性你喜歡，類型？莫比？自動對焦？

來源

2013-05-16 17:53:51 spons

我嘗試，但它看起來像編輯器不能處理插件內的功能！ –

試試CKEDITOR.instances [「YourEditor」]。fire（'MediaEmbed'）; 這應該至少激發對話.. – spons

我已經看了代碼..它非常簡單。創建您的嵌入標籤的HTML ..並使用我發佈在我的帖子「編輯」中的代碼。 – spons

我發現這個職位尋找答案...

簽出的答案中提供的鏈接在這裏[http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-fire]，向下滾動到的execCommand

這爲我工作，只需要你知道你的插件的名稱，所以它會一直工作。顯然，您可能需要將「可編輯」更改爲您的編輯器實例。

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

如果上面的失敗，HACK：

這會工作（下面第一行代碼），而是要求你看看源找到正確的＃。如果你有1個自定義插件，沒有什麼大不了的。但是如果你像我一樣有十幾個或更多，這是令人討厭的，並且可能隨着更多插件的添加而改變。

CKEDITOR.tools.callFunction(145,this);

希望這有助於！

來源

2014-05-30 08:26:24

CKEditor：調用沒有工具欄按鈕的插件函數

回答

相關問題