0

我是 TinyMCE 的新手，但我设法制作了一个按钮，该按钮<pre><code>...</code></pre>带有一些代码的标签。

在那里，用户只能编写源代码，但如果他们使用像 一样的按钮bold，那么它会变成粗体..

我一直在试图找出一种禁用它的方法，并发现当您超过特殊标签时可以禁用按钮。

所以我想知道，是否有人知道这是怎么可能的？

我有这个插件，它的例子是： https ://code.google.com/p/tinymce-pre-plugin/ 如果你看视频你会明白我的意思，他<pre><code>...</code></pre>在0:40.

您可以在此处查看插件文件的来源：

(function() {
    tinymce.PluginManager.requireLangPack('pre');

    tinymce.create('tinymce.plugins.PrePlugin', {       
        init : function(ed, url) {          
            var t = this;
            t.editor = ed;

            ed.addCommand('mcePre', function() {
                ed.windowManager.open({
                    file : url + '/dialog.htm',
                    width : 500 + parseInt(ed.getLang('pre.delta_width', 0)),
                    height : 300 + parseInt(ed.getLang('pre.delta_height', 0)),
                    inline : 1
                }, {
                    plugin_url : url
                });
            });

            ed.addButton('pre', {
                title : 'pre.desc',
                cmd : 'mcePre',
                image : url + '/img/pre.gif'
            });

            ed.onNodeChange.add(function(ed, cm, n) {
                cm.setActive('pre', n.nodeName == 'CODE');

                if(n.nodeName == 'CODE') t._setDisabled(1);
                else t._setDisabled(0);

                var notEmptyNode = n.innerHTML.replace(new RegExp('<\/?[^>]+>', 'gi'), '').replace(new RegExp('&nbsp;', 'gi'), '').match(/.*?[\S].*?/);
                if(notEmptyNode && n.nodeName != 'CODE')
                cm.setDisabled('pre', true);

            });
        },

        createControl : function(n, cm) {
            return null;
        },

        getInfo : function() {
            return {
                longname : 'Pre plugin',
                author : 'Marchenko Alexandr',
                authorurl : 'http://webdiz.com.ua',
                infourl : 'http://webdiz.com.ua',
                version : "1.0"
            };
        },


        _block : function(ed, e) {
            var k = e.keyCode;

            // Don't block arrow keys, pg up/down, and F1-F12
            if (k == 46 || (k > 32 && k < 41) || (k > 111 && k < 124))
                return;

            if (e.preventDefault) {
                e.preventDefault();
                e.stopPropagation();
            }
            else {
                e.returnValue = false;
                e.cancelBubble = true;
            }
            return false;
        },

        _setDisabled : function(s) {
            var t = this, ed = t.editor;

            tinymce.each(ed.controlManager.controls, function(c) {
                if(c.settings.cmd != 'mcePre') {
                    c.setDisabled(s);
                }
            });

            if (s !== t.disabled) {
                if (s) {
                    ed.onKeyDown.addToTop(t._block);
                    ed.onKeyPress.addToTop(t._block);
                    ed.onKeyUp.addToTop(t._block);
                    ed.onPaste.addToTop(t._block);
                } else {
                    ed.onKeyDown.remove(t._block);
                    ed.onKeyPress.remove(t._block);
                    ed.onKeyUp.remove(t._block);
                    ed.onPaste.remove(t._block);
                }

                t.disabled = s;
            }
        }
    });

    // Register plugin
    tinymce.PluginManager.add('pre', tinymce.plugins.PrePlugin);
})();
4

1 回答 1

1

我发现。

这是执行此操作的代码：

ed.onNodeChange.add(function(ed, cm, n) {
    cm.setActive('pre', n.nodeName == 'PRE');

    if(n.nodeName == 'PRE') t._setDisabled(1);
    else t._setDisabled(0);

    var notEmptyNode = n.innerHTML.replace(new RegExp('<\/?[^>]+>', 'gi'), '').replace(new RegExp('&nbsp;', 'gi'), '').match(/.*?[\S].*?/);
    if(notEmptyNode && n.nodeName != 'PRE')
    cm.setDisabled('pre', true);

});

更改PRE为应设置的任何标签，但它会禁用所有按钮，仅保留活动按钮，但也无法写入任何文本。

于 2013-01-06T04:09:40.657 回答