<html>
<head>
<title>The source code</title>
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
</head>
<body οnlοad="prettyPrint();">
<pre class="prettyprint lang-js"><div id="cls-Ext.form.HtmlEditor"></div>/**
* @class Ext.form.HtmlEditor
* @extends Ext.form.Field
* Provides a lightweight HTML Editor component. Some toolbar features are not supported by Safari and will be
* automatically hidden when needed. These are noted in the config options where appropriate.
* <br><br>The editor's toolbar buttons have tooltips defined in the {@link #buttonTips} property, but they are not
* enabled by default unless the global {@link Ext.QuickTips} singleton is {@link Ext.QuickTips#init initialized}.
* <br><br><b>Note: The focus/blur and validation marking functionality inherited from Ext.form.Field is NOT
* supported by this editor.</b>
* <br><br>An Editor is a sensitive component that can't be used in all spots standard fields can be used. Putting an Editor within
* any element that has display set to 'none' can cause problems in Safari and Firefox due to their default iframe reloading bugs.
* <br><br>Example usage:
* <pre><code>
// Simple example rendered with default options:
Ext.QuickTips.init(); // enable tooltips
new Ext.form.HtmlEditor({
renderTo: Ext.getBody(),
width: 800,
height: 300
});
// Passed via xtype into a container and with custom options:
Ext.QuickTips.init(); // enable tooltips
new Ext.Panel({
title: 'HTML Editor',
renderTo: Ext.getBody(),
width: 600,
height: 300,
frame: true,
layout: 'fit',
items: {
xtype: 'htmleditor',
enableColors: false,
enableAlignments: false
}
});
</code></pre>
* @constructor
* Create a new HtmlEditor
* @param {Object} config
* @xtype htmleditor
*/
Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
<div id="cfg-Ext.form.HtmlEditor-enableFormat"></div>/**
* @cfg {Boolean} enableFormat Enable the bold, italic and underline buttons (defaults to true)
*/
enableFormat : true,
<div id="cfg-Ext.form.HtmlEditor-enableFontSize"></div>/**
* @cfg {Boolean} enableFontSize Enable the increase/decrease font size buttons (defaults to true)
*/
enableFontSize : true,
<div id="cfg-Ext.form.HtmlEditor-enableColors"></div>/**
* @cfg {Boolean} enableColors Enable the fore/highlight color buttons (defaults to true)
*/
enableColors : true,
<div id="cfg-Ext.form.HtmlEditor-enableAlignments"></div>/**
* @cfg {Boolean} enableAlignments Enable the left, center, right alignment buttons (defaults to true)
*/
enableAlignments : true,
<div id="cfg-Ext.form.HtmlEditor-enableLists"></div>/**
* @cfg {Boolean} enableLists Enable the bullet and numbered list buttons. Not available in Safari. (defaults to true)
*/
enableLists : true,
<div id="cfg-Ext.form.HtmlEditor-enableSourceEdit"></div>/**
* @cfg {Boolean} enableSourceEdit Enable the switch to source edit button. Not available in Safari. (defaults to true)
*/
enableSourceEdit : true,
<div id="cfg-Ext.form.HtmlEditor-enableLinks"></div>/**
* @cfg {Boolean} enableLinks Enable the create link button. Not available in Safari. (defaults to true)
*/
enableLinks : true,
<div id="cfg-Ext.form.HtmlEditor-enableFont"></div>/**
* @cfg {Boolean} enableFont Enable font selection. Not available in Safari. (defaults to true)
*/
enableFont : true,
<div id="cfg-Ext.form.HtmlEditor-createLinkText"></div>/**
* @cfg {String} createLinkText The default text for the create link prompt
*/
createLinkText : 'Please enter the URL for the link:',
<div id="cfg-Ext.form.HtmlEditor-defaultLinkValue"></div>/**
* @cfg {String} defaultLinkValue The default value for the create link prompt (defaults to http:/ /)
*/
defaultLinkValue : 'http:/'+'/',
<div id="cfg-Ext.form.HtmlEditor-fontFamilies"></div>/**
* @cfg {Array} fontFamilies An array of available font families
*/
fontFamilies : [
'Arial',
'Courier New',
'Tahoma',
'Times New Roman',
'Verdana'
],
defaultFont: 'tahoma',
// private properties
validationEvent : false,
deferHeight: true,
initialized : false,
activated : false,
sourceEditMode : false,
onFocus : Ext.emptyFn,
iframePad:3,
hideMode:'offsets',
defaultAutoCreate : {
tag: "textarea",
style:"width:500px;height:300px;",
autocomplete: "off"
},
// private
initComponent : function(){
this.addEvents(
<div id="event-Ext.form.HtmlEditor-initialize"></div>/**
* @event initialize
* Fires when the editor is fully initialized (including the iframe)
* @param {HtmlEditor} this
*/
'initialize',
<div id="event-Ext.form.HtmlEditor-activate"></div>/**
* @event activate
* Fires when the editor is first receives the focus. Any insertion must wait
* until after this event.
* @param {HtmlEditor} this
*/
'activate',
<div id="event-Ext.form.HtmlEditor-beforesync"></div>/**
* @event beforesync
* Fires before the textarea is updated with content from the editor iframe. Return false
* to cancel the sync.
* @param {HtmlEditor} this
* @param {String} html
*/
'beforesync',
<div id="event-Ext.form.HtmlEditor-beforepush"></div>/**
* @event beforepush
* Fires before the iframe editor is updated with content from the textarea. Return false
* to cancel the push.
* @param {HtmlEditor} this
* @param {String} html
*/
'beforepush',
<div id="event-Ext.form.HtmlEditor-sync"></div>/**
* @event sync
* Fires when the textarea is updated with content from the editor iframe.
* @param {HtmlEditor} this
* @param {String} html
*/
'sync',
<div id="event-Ext.form.HtmlEditor-push"></div>/**
* @event push
* Fires when the iframe editor is updated with content from the textarea.
* @param {HtmlEditor} this
* @param {String} html
*/
'push',
<div id="event-Ext.form.HtmlEditor-editmodechange"></div>/**
* @event editmodechange
* Fires when the editor switches edit modes
* @param {HtmlEditor} this
* @param {Boolean} sourceEdit True if source edit, false if standard editing.
*/
'editmodechange'
)
},
// private
createFontOptions : function(){
var buf = [], fs = this.fontFamilies, ff, lc;
for(var i = 0, len = fs.length; i< len; i++){
ff = fs[i];
lc = ff.toLowerCase();
buf.push(
'<option value="',lc,'" style="font-family:',ff,';"',
(this.defaultFont == lc ? ' selected="true">' : '>'),
ff,
'</option>'
);
}
return buf.join('');
},
/*
* Protected method that will not generally be called directly. It
* is called when the editor creates its toolbar. Override this method if you need to
* add custom toolbar buttons.
* @param {HtmlEditor} editor
*/
createToolbar : function(editor
最低0.47元/天 解锁文章
09-07
7479
7479
“相关推荐”对你有帮助么？
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
