草庐IT

javascript - TinyMCE 自定义主题 - bullist numlist 链接取消链接不起作用

coder 2024-05-17 原文

所以我在他们的网站上使用按钮方法为 TinyMCE 创建了一个自定义主题。大多数按钮似乎都能正常工作,但 bullist、numlist、链接和取消链接按钮什么都不做。即使切换到 HTML View ,也不会添加 html(即 <ul><li></li></ul>)。我已经尝试为 advlist、advlink 等添加插件,但没有任何变化。似乎无法在线找到此问题的任何答案。

这是我的 tinymce 代码:

$('textarea.htmlify').tinymce({
    mode: 'textareas',
    script_url : host + '/js/admin/tinymce/tiny_mce.js',
    content_css: host + '/css/admin/tiny_mce.css',
    language: false,

    setup: function(editor) {
        $('.showPreview', '#' + editor.id + '_preview').click(function(event) {
            event.preventDefault();
            tinyMCE.execCommand('mceAddControl', false, editor.id);
            $('#'+editor.id + '_preview').css('display', 'none');
        });

        editor.addCommand('showHTML', function(ui, v){
            tinyMCE.execCommand('mceRemoveControl', false, editor.id);
            $('#'+editor.id + '_preview').css('display', 'block');
        });
    },

    theme: function(editor, target) {
        var editorContainer = $(target).after(
            '<div>' +
                '<div class="mce-toolbar clearfix">' +
                    '<button class="btn-mce-bold" data-mce-command="bold">Bold</button>' +
                    '<button class="btn-mce-italic" data-mce-command="italic">Italic</button>' +
                    '<button class="btn-mce-underline" data-mce-command="underline">Underline</button>' +
                    '<button class="btn-mce-strikethrough" data-mce-command="strikethrough">Strike Through</button>' +
                    '<button class="btn-mce-justifyleft" data-mce-command="justifyleft">Justify Left</button>' +
                    '<button class="btn-mce-justifycenter" data-mce-command="justifycenter">Justify Center</button>' +
                    '<button class="btn-mce-justifyright" data-mce-command="justifyright">Justify Right</button>' +
                    '<button class="btn-mce-justifyfull" data-mce-command="justifyfull">Justify Full</button>' +
                    '<button class="btn-mce-bullist" data-mce-command="bullist">Bullet List</button>' +
                    '<button class="btn-mce-numlist" data-mce-command="numlist">Number List</button>' +
                    '<button class="btn-mce-undo" data-mce-command="undo">Undo</button>' +
                    '<button class="btn-mce-redo" data-mce-command="redo">Redo</button>' +
                    '<button class="btn-mce-link" data-mce-command="link">Link</button>' +
                    '<button class="btn-mce-unlink" data-mce-command="unlink">Unlink</button>' +
                    '<button class="btn-mce-code" data-mce-command="showHTML">HTML</button>' +
                '</div>' +
                '<div class="htmlify"></div>' +
            '</div>'
        ).next();

        $('.mce-toolbar').css('width', $(target).css('offsetWidth'));

        // Bind events for each button
        $('button', editorContainer).click(function(event) {
            event.preventDefault();
            editor.execCommand(
                $(this).attr('data-mce-command'),
                false,
                $(this).attr('data-mce-value')
            );
        });

        // setup tabbing
        $tabindex = parseInt($('#' + editor.id).attr('tabindex'));
        if ($tabindex > 1) {
            $('[tabindex=' + ($tabindex-1) + ']').keydown(function(event) {
                var $keyCode = event.keyCode || event.which;
                if ($keyCode == 9) {
                    event.preventDefault();
                    editor.execCommand('mceFocus', false, editor.id);
                }
            });
        } else {
            editor.execCommand('mceFocus', false, editor.id);
        }

        editor.onKeyDown.add(function(ed, event) {
            var $tabindex = parseInt($('#' + ed.id).attr('tabindex'));
            var $keyCode = event.keyCode || event.which;
            if ($keyCode == 9) {
                $tabindex++;
                while(($("[tabindex='" + $tabindex + "']").length == 0 || $("[tabindex='" + $tabindex + "']:not([readonly])").length == 0) && $tabindex != 150 ){
                    $tabindex++;
                }
                if ($tabindex != 150)
                    $('[tabindex='+$tabindex+']').focus();
            }
        });

        // Register state change listeners
        editor.onInit.add(function(ed, event) {
            $('button', editorContainer).each(function(i, button) {
                editor.formatter.formatChanged($(button).data('mce-command'), function(state) {
                    $(button).toggleClass('btn-mce-on', state);
                });
            });

            $('#'+ed.id+'_ifr').css('height', '100%');
        });

        // Return editor and iframe containers
        return {
            editorContainer: editorContainer[0],
            iframeContainer: editorContainer.children().eq(-1),

            // Calculate iframe height: target height - toolbar height
            iframeHeight: $(target).height() - editorContainer.first().outerHeight()
        };
    }    
});

最佳答案

尝试添加这些插件:

                plugins: [
                        "link lists",
                ],

关于javascript - TinyMCE 自定义主题 - bullist numlist 链接取消链接不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14453080/

有关javascript - TinyMCE 自定义主题 - bullist numlist 链接取消链接不起作用的更多相关文章

  1. ruby - Facter::Util::Uptime:Module 的未定义方法 get_uptime (NoMethodError) - 2

    我正在尝试设置一个puppet节点,但ruby​​gems似乎不正常。如果我通过它自己的二进制文件(/usr/lib/ruby/gems/1.8/gems/facter-1.5.8/bin/facter)在cli上运行facter,它工作正常,但如果我通过由ruby​​gems(/usr/bin/facter)安装的二进制文件,它抛出:/usr/lib/ruby/1.8/facter/uptime.rb:11:undefinedmethod`get_uptime'forFacter::Util::Uptime:Module(NoMethodError)from/usr/lib/ruby

  2. ruby-on-rails - Rails 3.2.1 中 ActionMailer 中的未定义方法 'default_content_type=' - 2

    我在我的项目中添加了一个系统来重置用户密码并通过电子邮件将密码发送给他,以防他忘记密码。昨天它运行良好(当我实现它时)。当我今天尝试启动服务器时,出现以下错误。=>BootingWEBrick=>Rails3.2.1applicationstartingindevelopmentonhttp://0.0.0.0:3000=>Callwith-dtodetach=>Ctrl-CtoshutdownserverExiting/Users/vinayshenoy/.rvm/gems/ruby-1.9.3-p0/gems/actionmailer-3.2.1/lib/action_mailer

  3. ruby-on-rails - form_for 中不在模型中的自定义字段 - 2

    我想向我的Controller传递一个参数,它是一个简单的复选框,但我不知道如何在模型的form_for中引入它,这是我的观点:{:id=>'go_finance'}do|f|%>Transferirde:para:Entrada:"input",:placeholder=>"Quantofoiganho?"%>Saída:"output",:placeholder=>"Quantofoigasto?"%>Nota:我想做一个额外的复选框,但我该怎么做,模型中没有一个对象,而是一个要检查的对象,以便在Controller中创建一个ifelse,如果没有检查,请帮助我,非常感谢,谢谢

  4. ruby - 主要 :Object when running build from sublime 的未定义方法 `require_relative' - 2

    我已经从我的命令行中获得了一切,所以我可以运行rubymyfile并且它可以正常工作。但是当我尝试从sublime中运行它时,我得到了undefinedmethod`require_relative'formain:Object有人知道我的sublime设置中缺少什么吗?我正在使用OSX并安装了rvm。 最佳答案 或者,您可以只使用“require”,它应该可以正常工作。我认为“require_relative”仅适用于ruby​​1.9+ 关于ruby-主要:Objectwhenrun

  5. ruby - 在 Ruby 中有条件地定义函数 - 2

    我有一些代码在几个不同的位置之一运行:作为具有调试输出的命令行工具,作为不接受任何输出的更大程序的一部分,以及在Rails环境中。有时我需要根据代码的位置对代码进行细微的更改,我意识到以下样式似乎可行:print"Testingnestedfunctionsdefined\n"CLI=trueifCLIdeftest_printprint"CommandLineVersion\n"endelsedeftest_printprint"ReleaseVersion\n"endendtest_print()这导致:TestingnestedfunctionsdefinedCommandLin

  6. ruby - 定义方法参数的条件 - 2

    我有一个只接受一个参数的方法:defmy_method(number)end如果使用number调用方法,我该如何引发错误??通常,我如何定义方法参数的条件?比如我想在调用的时候报错:my_method(1) 最佳答案 您可以添加guard在函数的开头,如果参数无效则引发异常。例如:defmy_method(number)failArgumentError,"Inputshouldbegreaterthanorequalto2"ifnumbereputse.messageend#=>Inputshouldbegreaterthano

  7. ruby - 如何在 Grape 中定义哈希数组? - 2

    我使用Ember作为我的前端和GrapeAPI来为我的API提供服务。前端发送类似:{"service"=>{"name"=>"Name","duration"=>"30","user"=>nil,"organization"=>"org","category"=>nil,"description"=>"description","disabled"=>true,"color"=>nil,"availabilities"=>[{"day"=>"Saturday","enabled"=>false,"timeSlots"=>[{"startAt"=>"09:00AM","endAt"=>

  8. ruby - 获取模块中定义的所有常量的值 - 2

    我想获取模块中定义的所有常量的值:moduleLettersA='apple'.freezeB='boy'.freezeendconstants给了我常量的名字:Letters.constants(false)#=>[:A,:B]如何获取它们的值的数组,即["apple","boy"]? 最佳答案 为了做到这一点,请使用mapLetters.constants(false).map&Letters.method(:const_get)这将返回["a","b"]第二种方式:Letters.constants(false).map{|c

  9. ruby-on-rails - Ruby url 到 html 链接转换 - 2

    我正在使用Rails构建一个简单的聊天应用程序。当用户输入url时,我希望将其输出为html链接(即“url”)。我想知道在Ruby中是否有任何库或众所周知的方法可以做到这一点。如果没有,我有一些不错的正则表达式示例代码可以使用... 最佳答案 查看auto_linkRails提供的辅助方法。这会将所有URL和电子邮件地址变成可点击的链接(htmlanchor标记)。这是文档中的代码示例。auto_link("Gotohttp://www.rubyonrails.organdsayhellotodavid@loudthinking.

  10. ruby - 这两个 Ruby 类初始化定义有什么区别? - 2

    我正在阅读一本关于Ruby的书,作者在编写类初始化定义时使用的形式与他在本书前几节中使用的形式略有不同。它看起来像这样:classTicketattr_accessor:venue,:datedefinitialize(venue,date)self.venue=venueself.date=dateendend在本书的前几节中,它的定义如下:classTicketattr_accessor:venue,:datedefinitialize(venue,date)@venue=venue@date=dateendend在第一个示例中使用setter方法与在第二个示例中使用实例变量之间是

随机推荐