您的位置:首页 > Web前端 > HTML

Ext.form.field.HtmlEditor编辑器字段

2012-04-22 19:32 423 查看
1、Ext.form.field.HtmlEditor主要配置项

配置项类型说明
createLinkTextString创建连接提示框中默认提示信息
defaultLinkValueString创建连接的默认值,默认为http://
defaultValueString编辑器默认值
enableAlignmentsBoolean是否启用左中右对齐按钮,默认为true
enableColorsBoolean是否启用前景色、背景色选择按钮,默认为true
enableFontBoolean是否启用选择字体按钮,默认为true
enableFontSizeBoolean是否启用增大缩小字体按钮,默认为true
enableFormatBoolean是否启用粗体、斜体、下划线按钮,默认为true
enableLinksBoolean是否启用创建连接按钮,默认为true
enableListsBoolean是否启用列表按钮,默认为true
enableSourceEditBoolean是否启用源代码编辑按钮,默认为true
fontFamiliesArray字体数组
buttonsTipsObject编辑器工具栏中按钮的提示信息配置对象组合,用来自定义工具栏提示消息
2、Ext.form.field.HtmlEditor示例

代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Ext.form.field.HtmlEditor示例</title>
<link href="ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script src="ext-4.0.7-gpl/bootstrap.js" type="text/javascript"></script>
<script type="text/javascript">
Ext.onReady(function () {
Ext.QuickTips.init();
Ext.create("Ext.form.Panel", {
title: "Ext.form.field.HtmlEditor示例",
width: 600,
frame: true,
renderTo: Ext.getBody(),
bodyPadding: 5,
items: [{
fieldLabel: "HTML字段",
xtype: "htmleditor",
height: 150,
width: 580,
labelWidth: 70,
labelSeparator: ":",
createLinkText: "创建超链接",
defaultLinkValue: "http://",
enableAlignments: true,
enableColors: true,
enableFont: true,
enableFontSize: true,
enableFormat: true,
enableLinks: true,
enableLists: true,
enableSourceEdit: true,
fontFamilies: ["宋体", "隶书", "黑体"]
}]
});
});
</script>
</head>
<body>
</body>
</html>


效果图:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: