1

我正在使用 TinyMCE,我想将默认字体大小设置为 12。

在这里,我为活动的 TinyMCE 编辑器分配了一个变量,但它不起作用......

HTML 内容:

<textarea id="text_message"></textarea>

JavaScript:

$("#text_message").tinymce({        
    // Location of TinyMCE script
    script_url: '/static/app/a/scripts/tinymce/jscripts/tiny_mce/tiny_mce.js'
});

var fontSize = 12;
tinyMCE.activeEditor.formatter.apply('fontSize', 
{
    value: fontSize
});
4

1 回答 1

2

您应该等待几个不同的事件阶段:

  1. 页面在某种状态下准备就绪。(tinyMCE.init()也可以使用,视情况而定。)
  2. 编辑器已经初始化,可以开始使用了。

第一个可以使用以下任一方式完成:

$(document).ready()

或者:

$(window).load()

两者都处理与页面就绪相关的事件。$.ready()在 DOM 可用时$.load()触发window,在页面内容已加载时触发(例如 inline imgscriptlinksources )。.ready()稍微先于另一个触发,但在许多情况下,任何一个都可以工作。

请注意,下面我有jQuery(function($){...});一个快捷方式,可以帮助管理与全局$(document).ready();使用的其他框架的冲突。$

在第二阶段,您需要为您的编辑器创建请求添加一个初始化事件处理程序,例如:

$.tinymce({ init_instance_callback: function(){ ... } });

在全:

$tiny.tinymce({
    // ... other stuff here, comma-delineated
    init_instance_callback: function(){
        ac = tinyMCE.activeEditor;

        ac.dom.setStyle(ac.getBody(), 'fontSize', fontSize);
    }
    // ... other stuff here, comma-delineated
});

您可以在此处设置显示font-size(使用 的 Javascript 属性fontSize,因为 Javascript 不允许-在诸如 之类的标签中使用font-size)。这将等待您添加的编辑器进行初始化并说“嘿,我现在在这里”。一旦您收到发泄触发的通知,您可以将编辑器bodyac.getBody()返回的内容)设置为font-size: 18px.

这意味着font-size一旦您选择保存编辑器内容就不会返回;在大多数情况下(除非您选择初始化选项) ,它在编辑器“body”(字面意思是iframe's元素)中位于其上方。所以这是一个“默认”,但没有在内容本身中明确设置。bodyplugins : "fullpage"

如果您安装了带有 Firebug 插件的 Chrome 或 Firefox,请观看console此小提琴:

http://jsfiddle.net/userdude/9PuUx/1/

这是工作代码演示和指向小提琴演示的链接(我18px用来轻松查看更改):

jQuery(function a($){
    var $tiny = $("#text_message"),
        fontSize = '18px',
        ac;

    $tiny.tinymce({
        mode : "textareas",
        theme : "advanced",
        theme_advanced_buttons1 : "fontsizeselect,bold,underline,italic",
        init_instance_callback: function(){
            ac = tinyMCE.activeEditor;

            ac.dom.setStyle(ac.getBody(), 'fontSize', fontSize);
        }
    });
});​

http://jsfiddle.net/userdude/9PuUx/

tinyMCE 文档和 API 可能有点混乱和缺乏,而且我也不是使用它的专家,所以我知道可能有四五种其他方法来解释正在发生的事情以及如何做到这一点。你的旅费可能会改变。如果您对我这样做的方式有疑问,或者它似乎没有达到您想要或期望的效果,请发表评论并告诉我。

于 2012-09-23T20:31:22.950 回答