TinyMce编辑器使⽤详解(摘)
<!-- tinyMCE -->
<script language="javascript" type="text/javascript" src="jscripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
mode : "textareas"
});
</script>
<!-- /tinyMCE -->
注意以上红⾊部分是tiny_mce.js脚本⽂件的位置,该⽂件中包含了编辑器所需要的全部代码,主题及语⾔包将在初始化时被加载。
蓝⾊部分是初始化调⽤,它⽣成TinyMCE的全局实例,其中的设置及名称-值属性将在以后描述。
设置
以名称-值属性⽅式传递给tinyMCE的init⽅法的设置控制着程序的全局⾏为。所有的键及可能的键值如下表所⽰。注意,⽤[]括起来的名称是可选的,不是必须的设置。
常规设置
mode Mode可以是以下⼏个值之⼀:
textareas - 页⾯加载时把所有TEXTAREA组件转换成编辑器.
specific_textareas - 将所有"mce_editable"属性值为true的TEXTAREA转换成编辑器. exact - 只转换在"elements"设置中指定的确切组件.
[theme]指定要使⽤的主题名称,主题将被放在TinyMCE的themes⽬录下,默认为default。TinyMCE⾃带三个内置的主题,它们是simple,default和advanced。
如果你想创建⾃⼰的主题,请仔细阅读⽂档的部分。
[plugins]此选项是⼀系列以逗号分隔的主题插件列表(例如,可以只⽤来扩展图像对话框)。这些插件
覆盖了主题模板中定义的功能。插件逻辑应该包含在⼀个叫"editor_plugin.js"的⽂件中,它是插件⽬录中唯⼀被包含进来的⽂件。
例如:"my_image_dialog,my_link_dialog".
如果你想创建⾃⼰的插件,请仔细阅读⽂档的部分。
[language]TinyMCE中使⽤的语⾔包,这应该是像se,uk,us等诸如此类的FN代码,它被⽤来从"langs"⽬录中获取语⾔包,该设置的默认值为"uk".
中⽂⽤户建议您使⽤"zh-CN"
[elements]以逗号分隔的⽤来转换成编辑器的组件列表,该选项仅在"mode"选项被设置成"exact"时使⽤。该列表中的元素可以是任何有id或name属性的HTML组件。
[ask]当"mode"被设置成"textareas"或"specific_textareas"的时候,该选项被应⽤,询问⽤户输⼊框是否将被转换成编辑器。
如果你想使⽤这个选项,将它设置为true.
[textarea_trigger]textarea(⽂本域)触发器的属性,默认值为"mce_editable"。
该选项仅在"mode"被设置
为"specific_textareas"时使⽤。
[valid_elements]以逗号分隔开的组件转换部分的列表。
例如:
a[href|target=_blank],strong/b,div[align],br.以上例⼦告诉TinyMCE移除所有除了"a, strong, div"和"br"的组件,将元素b转换成strong,默认target设为"_blank"并保持href、target、align属性。在匹配组件及属性的名称时可以使⽤像*,+,?这样的通配符。
字符:
,各组件定义之间的分隔符。
/
两个同义组件之间的分隔符。第⼀个组件是会被⽤来输出的那个(即第⼆个组件被第⼀个替换)。
|各属性定义之间的分隔符。
[定义某组件的属性列表的开始符号。
]定义某组件的属性列表的结束符号。
=将属性的默认值设为特定值。例
如:"target=_blank"
:将属性的值强⾏设为特定值。例
如:"border:0"
<;校验某个属性的值。例
如:"target<_blank?_self"
属性校验值之间的分隔符,见上。
特殊变量:
{$uid} - 产⽣⼀个唯⼀ID号。例如:"p[id: {$uid}]".
此选项的默认值是以下模式:
此选项的默认值是以下模式:
"a[href|target],strong/b[class],em/i[class],strik e[class],u[class],p[class|align],ol,ul,li,br,
img[class|src|border=0|alt|hspace|vspace|wi dth|height|align],sub,sup,blockquote[dir|style ],
table[border=0|cellspacing|cellpadding|widt h|height|class|align],tr[rowspan],
td[colspan|rowspan|width|height],div[class|a lign],span[class|align],pre[class|align], address[class|align],h1[class|align],h2[class| align],h3[class|align],
h4[class|align],h5[class|align],h6[class|align] ,hr".
要包含所有组件及属性,请使⽤ *[*] ,这在使⽤invalid_elements选项时特别有⽤。
[extended_valid_elements]向"valid_elements"列表末尾添加可⽤组件。此选项在你仅仅想往默认列表中增添部分组件时相当有⽤。
格式与"valid_elements"⼀致。
[invalid_elements]输出时需要排除在外的组件名称列表,以逗
号分隔开。
[trim_span_elements]True/False选项。如果设置为true,不需要的组件将被移除。默认值即为true。
[verify_css_classes]True/False选项。如果设置为true,将会校验CSS的class属性。默认值即为true。
[verify_html]True/False选项。代表着HTML内容是否需要校验。默认值为true。
[urlconvertor_callback]当清理进程处理URL的时候调⽤的函数名。此函数必须遵从以下的格式:func(url, node, on_save) ,返回转换后的URL。此设置专为集成⽬的⽽设。参数url代表要转换的地
址,node代表包含URL的那个节
点,on_save是⼀个布尔值(在⽤户提交表单时为真)。
[preformatted]True/False选项。如果设置为true,编辑器将把制表符(TAB)转换成缩进,除此外保持其他whitespace(空⽩字符、换⾏等)字符,就如同HTML标签中的PRE的效果。默认值为false。
[insertlink_callback]当执⾏"insertlink"命令时调⽤的函数名。此函数获取选定链接的地址和⽬标,返回⼀
个以"href", "target"和 "title"为collection名称的数组。当使⽤新窗⼝时,为了兼容Mozilla,会在window.opener(弹出窗⼝的母窗⼝,译者注)上调⽤tinyMCE.insertLink。
[insertimage_callback]当执⾏"insertimage"命令时调⽤的函数名。此函数获取选定图像的url并返回⼀个以src和alt为collection名称的数组。当使⽤新窗⼝时,为了兼容Mozilla,会在window.opener 上调⽤tinyMCE.insertImage。
函数格式:insertimage(src, alt, border, hspace, vspace, width, height, align, title,
hspace, vspace, width, height, align, title, onmouseover, onmouseout, action).
[setupcontent_callback]当编辑器初始化时调⽤的函数名。函数格式:setupContentCallback(editor_id, node),其中editor_id是编辑器的id,node是编辑器所在的body组件节点。
[save_callback]当执⾏triggerSave(触发保存)命令被调⽤时调⽤的函数名。函数格式:save(id, content, node),如果有特定返回值,其值将会被加到HTML表单组件上。所以可以通过此函数来⾃定义⽤户转换逻辑。
[docs_language]TinyMCE⽂档中使⽤的语⾔,这应该是像se,uk,us等诸如此类的FN代码,它被⽤来从" <theme>/docs/<lang>"⽬录中获取⽂档。该选项的默认值跟language选项⼀致。
[width]编辑器的宽度,它默认的宽度是原先被替换
的组件宽度。
[height]编辑器的⾼度,它默认的⾼度是原先被替换
的组件⾼度。
[content_css]编辑窗⼝中要使⽤的CSS⽂件,其路径应该
跟页⾯相关。
[popups_css]像插⼊链接和图⽚时的弹出窗⼝中使⽤的
CSS⽂件,其路径应该跟页⾯相关。
[editor_css]编辑器使⽤的CSS⽂件,其路径应该跟页⾯
相关。
[encoding]编辑器的输出编码,此选项⽬前只能为"html"或者空。如果设置为"html",编辑器的输出将经过HTML编码处理。
例如:<;将会变成<,依此类推。默认值是空。
[debug]True/False选项。如果设置成true,像css⽂件路径等调试信息将会被显⽰。
[visual]True/False选项。如果设置成true,当边框设置成0的时候,为达到更好的视觉效果在编辑器中表格会有虚线出现。
默认值为true。
[visual_table_style]⽤户可⾃定义表格的样式,默认值
为:"border: 1px dashed #BBBBBB"。
[add_form_submit_trigger]True/False选项。如果设置成true,将强制进⾏所有表单的"onsubmit"事件处理并引发保存。此选项默认值为true。
[add_unload_trigger]True/False选项。如果设置成true,在"onunload"事件发⽣时,当前窗⼝会引发⼀个triggerSave调⽤。此triggerSave调⽤不会做任何清理⼯作,因为它是⽤来处理前进/后退按钮的。此选项默认值为true。
[force_br_newlines]True/False选项。此选项强制编辑器将段落符号(P)替换成换⾏符(BR)。此选项默认值为false。(实验阶段)
[force_p_newlines]True/False选项。如果打开此选项,在按下回车键(Enter)时Mozilla/Firefox浏览器会⽣成段落符号(P),在按下Shift+Enter时会⽣成换⾏符(BR)。此选项默认为true。
[relative_urls]True/False选项。如果设置成true,绝对路径将被转换成相对路径。默认值为true。True/False选项。在设置成true的情况下,如果URL中的主机名、端⼝号跟编辑器当前所在⼀致,它们会被移除。
[remove_script_host]在⼀致,它们会被移除。
例如:编辑器所在站点为
www.somesite ,那么以下链接www.somesite/somedir/somepag e.html 将会被转换成
/somedir/somepage.html 。
如果relative_urls被设置成false,此选项默认为true。
[focus_alert]True/False选项。如果设置成true,编辑器在失去焦点的时候就会出现⼀个烦⼈的警告框。默认值为true。
[document_base_url]在将绝对路径转换成相对路径的时候会⽤到此⽂档的URL。这个选项指定了编辑器当前的默认⽂档。
注意如果此选项指定到⼀个域名,请添加协议前缀,并以斜杠结尾。例如:
www.somehost/mydir/
[custom_undo_redo]True/False选项。此选项可以使撤消/重做功能更加完善。默认值为true。
编辑器在线使用[custom_undo_redo_levels]⾃定义最多可撤消操作的次数,默认是⽆限
制。
[custom_undo_redo_keyboard_shortcuts]如果使⽤,编辑器可以使⽤Ctrl+Z和Ctrl+Y快
捷键来实现撤消和重做。默认允许。
[fix_content_duplication]True/False选项。此选项修正了MSIE中⼀个内容重复的bug。默认启⽤,但是
为了兼容性也可以禁⽤(false)。
[directionality]此选项可以设置像阿拉伯语等语⾔的⽂字⽅向。可能的值为:ltr, rtl。默认值: ltr(从左到右)。
[auto_cleanup_word]如果启⽤,从MS office/Word粘贴的HTML将会⾃动被清理。此选项默认值为false。
注意:此操作当前仅⽀持MSIE。
[cleanup_on_startup]如果启⽤,在编辑器初始化时⽂本域及组件
将会被清理。默认值为false。
[inline_styles]如果启⽤,像width,height,vspace,hspace和align等属性将会被风格属性替代。默认值为false。
在使⽤此选项时记得要把风格属性应⽤在正确的组件上。
[convert_newlines_to_brs]如果启⽤,所有的\n(新⾏)将会在编辑器启动时被转换成<br />组件。此选项默认值为false。
[auto_reset_designmode]因为在调⽤style.display的none/block⽅法来显⽰/隐藏某个TinyMCE编辑器的时候有bug,设计模式需要被重置。此选项⼀旦启⽤,当编辑器聚焦时,将⾃动重置。默认值为false。
[entities]⼀张以字符代码来查名称的表,该表中元素是以逗号分隔开的实体列表。该列表以奇数项、偶数项区分,其中奇数项是被⽤来转换的字符代码,偶数项是代表那个字符代码的实体名称。例
如:"8205,zwj,8206,lrm,8207,rlm,173,shy"。
[cleanup_callback]⾃定义清理函数。此选项能让⽤户在默认的清理基础上有所扩展。此函数调⽤跟默认的调⽤是分开的,它并不替换默认的清理函
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论