javascript - 如何将 Balloonpanel 插件集成到我的编辑器中?

标签 javascript html ckeditor

我尝试将气球面板插件集成到我的编辑器中。

我使用文档中的代码。

editor.on( 'instanceReady', function() {
 var toolbar = new CKEDITOR.ui.balloonToolbar( editor );

 toolbar.addItems( {
    link: new CKEDITOR.ui.button( {
        command: 'link'
    } ),
    unlink: new CKEDITOR.ui.button( {
        command: 'unlink'
    } )
 } );

 editor.on( 'selectionChange', function( evt ) {
    var lastElement = evt.data.path.lastElement;

    if ( lastElement ) {
        toolbar.attach( lastElement );
    }
 } );
} );

但是,当我单击编辑器时,它会给出以下错误消息。

Error Message

下面提供了文档链接

Balloonpanel Docs Link

不知道什么意思。

更新:(附上代码)

我的原始代码看起来像这样,

<body>
    <textarea id="editor1"></textarea>
    <script>
        CKEDITOR.replace('editor1', {
        toolbarGroups: [{
            name: 'basicstyles'
        }, {
            name: 'authorgroup'
        }],
        removePlugins: 'indent,indentblock,indentlist,list,removeformat,table,tabletools,entities,menu,find,font,iframe,pagebreak,flash,print,preview,save,smiley,pastetext,crossreference,youtube,footnotes,dragdrop,basket,horizontalrule,indentlist,image,format,selectall,specialchar,spellchecker,pastefromword,showblocks,link,unlink,anchor,copyformatting',
        extraPlugins: 'indentmodify,indentblockmodify,indentlistmodify,listmodify,removeformatmodified,table1,tabletools1,entitiesmodified,menumodified,findmodified,stylesheetparser,characterStyle,zoom,eventhandler,navigate,comment,symbol,notification,authorproff,proffpara,Newcitation,customfootnotes,floatingmenu,pubsearch,balloontoolbar,balloonpanel,autocorrect' 
        });    


        //My instanceReady Code Goes Here

        </script>
</body> 

最佳答案

我使用新的 CKEditor 实例检查了此代码示例,它工作正常。您向我们提供的信息太少,无法得到任何可靠的答案。

要在没有错误或奇怪行为的情况下运行此示例,您应该在 CKEditor 配置中包含 wysiwygarea,toolbar,link,balloontoolbar 插件。访问Setting CKEditor configuration如果您需要一些帮助。

如果它不能解决您的问题,请向我们展示一些代码或尝试使用最少的配置重现问题。

Codepen工作样本。

我必须提到,它无法按预期工作,因为我们在选择的 balloonpanel 定位方面存在一些问题。您可以在github上找到有关问题实际状态的更多信息。

关于javascript - 如何将 Balloonpanel 插件集成到我的编辑器中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49318773/

相关文章:

javascript - Safari 橡皮筋在 DIV 上滚动但不在页面上滚动

maven - 解决获取依赖项的错误 : Failed to read artifact descriptor for org. grails.plugins :ckeditor:zip:3. 6.6.1.0

javascript - CK编辑器.设置每页最大字数?

javascript - 拉入 JSON 数据

javascript - 如何在 JavaScript 中通过换行符从字符串创建数组?

javascript - 如何从 XUL <browser> 中运行的脚本(例如在侧边栏中)中获取当前事件浏览器窗口/选项卡的 URL

javascript - 我的 JSON 数据仅填充到一个 ul 元素中,而不是每个 ul 元素中

javascript - 如何让 sweetalert 在没有 promise 的情况下返回 true/false 以进行确认?

javascript - 使用 Login with Amazon 时遇到问题

javascript - 阻止 CKEditor 删除 Facebook Like Box 代码