TinyMCE链接和取消链接按钮在自定义主题中不起作用

Question

我有一个TinyMCE自定义主题，带有几个按钮（粗体，斜体，删除线，左对齐，中间和右边，bullist，numlist，link和unlink）。

问题在于numlist，bullist，link和unlink按钮。这些不起作用，其他人表现良好。

我的tinyMCE.init看起来像这样：

tinyMCE.init({

                mode: "textareas",
                editor_selector: "tinymce",
                language: false, // Prevents language packs from loading

                theme: function(editor, target) {
                    var dom = tinymce.DOM, editorContainer;

                    // Generate UI
                    editorContainer = dom.insertAfter(dom.create('div', {style: 'border: 1px solid gray'},
                        '<div>' +
                            '<button class="tinybutton tinybold" data-mce-command="bold"></button>' +
                            '<button class="tinybutton tinyitalic" data-mce-command="italic"></button>' +
                            '<button class="tinybutton tinystrike" data-mce-command="strikethrough"></button>' +
                            '<button class="tinybutton tinybullist" data-mce-command="bullist"></button>' +
                            '<button class="tinybutton tinynumlist" data-mce-command="numlist"></button>' +
                            '<button class="tinybutton tinyleft" data-mce-command="justifyleft"></button>' +
                            '<button class="tinybutton tinycenter" data-mce-command="justifycenter"></button>' +
                            '<button class="tinybutton tinyright" data-mce-command="justifyright"></button>' +
                            '<button class="tinybutton tinylink" data-mce-command="link"></button>' +
                            '<button class="tinybutton tinyunlink" data-mce-command="unlink"></button>' +
                        '</div>' 
                    ), target);

                    // Set editor container size to target element size
                    dom.setStyle(editorContainer, 'width', target.offsetWidth);

                    // Bind events for each button
                    tinymce.each(dom.select('button', editorContainer), function(button) {
                        dom.bind(button, 'click', function(e) {
                            e.preventDefault();

                            // Execute editor command based on data parameters
                            editor.execCommand(
                                dom.getAttrib(e.target, 'data-mce-command'),
                                false,
                                dom.getAttrib(e.target, 'data-mce-value')
                            );
                        });
                    });

                    // Register state change listeners
                    editor.onInit.add(function() {
                        tinymce.each(dom.select('button', editorContainer), function(button) {
                            editor.formatter.formatChanged(dom.getAttrib(button, 'data-mce-command'), function(state) {
                                button.style.color = state ? "red" : "";
                            });
                        });
                    });

                    // Return editor and iframe containers
                    return {
                        editorContainer: editorContainer,
                        iframeContainer: editorContainer.lastChild,

                        // Calculate iframe height: target height - toolbar height
                        iframeHeight: target.offsetHeight - editorContainer.firstChild.offsetHeight
                    };
                },

                encoding: "xml",
                setup: function (ed) {

                    ed.onContextMenu.add(function (ed, e) {
                        tinymce.activeEditor.save();
                    });
                    ed.onKeyUp.add(function (ed) {
                        tinymce.activeEditor.save();
                    });
                    ed.onClick.add(function (ed) {
                        tinymce.activeEditor.save();
                    });
                    ed.onGetContent.add(function (ed, o) {
                        o.content = o.content.replace(/'/g, "&apos;");
                    });
                    //ed.onInit.add(function (ed, evt) {
                    //    tinymce.dom.Event.add(ed.getDoc(), 'blur', function (e) {
                    //        // Do something when the editor window is blured.
                    //        tinymce.activeEditor.save();
                    //    });
                    //});
                },
                width: "100%"                    
            });

我不确定这是我应该如何处理所有按钮，或者我必须处理那些不能以其他方式工作的按钮。这是使用标准按钮的正确方法吗？

editor.execCommand(
       dom.getAttrib(e.target, 'data-mce-command'),
       false,
       dom.getAttrib(e.target, 'data-mce-value')
       );

Answer 1

  

使用editor_css定义工具栏图标。制作一个新皮肤并使用默认按钮。