Ckeditor事件句柄

时间:2016-03-02 06:20:00

标签: javascript jquery ckeditor

我有一张桌子,我希望每个细胞都可以编辑。 当用户点击一个单元格时,我可以编辑每个单元格。

我的代码可以很好地完成工作,我希望更新的数据可以在编辑完成后更新到服务器数据库,所以我捕获模糊事件这样做,问题是当我在工具栏中选择文本颜色时,模糊事件也被触发了,那么,你能告诉我解决这个问题吗?或者还有其他方法来完成工作。

这是我的代码:

            <html>
            <head>
                <script type="text/javascript" language="javascript" src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
                <script language="javascript" src="ckeditor/ckeditor.js"></script>
                <script language="javascript" src="ckeditor/adapters/jquery.js"></script>
                <script language="javascript">
                    $(document).ready(function() {
                        $("[id^='editor']").ckeditor().on("blur",function(){alert($(this).ckeditor().editor.getData());return false;});                                                             </script>   
            </head>
            <body>
                <table border=1>
                    <tr>
                        <td>
                            <div id="editor1" contenteditable="true">
                                <h1>Inline Editing in Action!</h1>
                                <p>The "div" element that contains this text is now editable.</p>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div id="editor2" contenteditable="true">
                                <h1>Inline Editing in Action!</h1>
                                <p>The "div" element that contains this text is now editable.
                            </div>
                        </td>
                    </tr>           
                </table>
            </body>
        </html> 

这是我的config.js

        CKEDITOR.editorConfig = function( config ) {
            // Define changes to default configuration here.
            // For complete reference see:
            // http://docs.ckeditor.com/#!/api/CKEDITOR.config

            // The toolbar groups arrangement, optimized for a single toolbar row.
            config.toolbarGroups = [
                { name: 'document',    groups: [ 'mode', 'document', 'doctools' ] },
                { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
                { name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
                { name: 'forms' },
                { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
                { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
                { name: 'links' },
                { name: 'insert' },
                { name: 'styles' },
                { name: 'colors' },
                { name: 'tools' },
                { name: 'others' },
                { name: 'about' }
            ];

            // The default plugins included in the basic setup define some buttons that
            // are not needed in a basic editor. They are removed here.
            config.removeButtons = 'Anchor,Underline,Strike,Subscript,Superscript,Link,Unlink,Styles,About,HorizontalRule,Blockquote,Italic,SpellChecker,SpecialChar,Format';

            // Dialog windows are also simplified.
            config.removeDialogTabs = 'link:advanced';

            config.extraPlugins = 'onchange';
        };

非常感谢

0 个答案:

没有答案