Skip to content
WebBuilder 文档

Ext.form.field.HtmlEditor

xtype 为 htmleditor 的 Ext JS 原生组件参考。

Updated View as Markdown

源码定义：ext-all-debug.js:108435。分类：表单与字段。

创建示例

var component = Ext.create("Ext.form.field.HtmlEditor", {
  xtype: "htmleditor",
  activated: false,
  allowDomMove: true,
  autoCreate: "示例值",
  buttonTips: {,
  renderTo: Ext.getBody()
});

属性

属性 类型 默认值 说明 配置示例
activated Boolean false 控制是否启用 activated 行为。 activated: false
allowDomMove Boolean - 控制是否启用 allowDomMove 行为。 allowDomMove: true
autoCreate String - 配置组件的 autoCreate 选项。 autoCreate: "示例值"
buttonTips Object { 配置组件的 buttonTips 选项。 buttonTips: {
clearInvalid Mixed Ext.emptyFn 配置组件的 clearInvalid 选项。 clearInvalid: Ext.emptyFn
componentLayout String 'htmleditor' 组件采用的内部布局策略。 componentLayout: 'htmleditor'
componentTpl Array [ 配置生成组件内容的 componentTpl 模板。 componentTpl: [
containerElCls Mixed Ext.baseCSSPrefix + 'html-editor-container' 配置 containerElCls 对应的 CSS 类名。 containerElCls: Ext.baseCSSPrefix + 'html-editor-container'
createLinkText String 'Please enter the URL for the link:' 配置组件的 createLinkText 选项。 createLinkText: 'Please enter the URL for the link:'
defaultLinkValue String 'http:/'+'/' 配置组件的 defaultLinkValue 选项。 defaultLinkValue: 'http:/'+'/'
defaultValue Mixed (Ext.isOpera || Ext.isIE6) ? ' ' : '&#82... 配置组件的 defaultValue 选项。 defaultValue: (Ext.isOpera || Ext.isIE6) ? ' ' : '&#82...
enableAlignments Boolean true 控制是否启用 enableAlignments 行为。 enableAlignments: true
enableColors Boolean true 控制是否启用 enableColors 行为。 enableColors: true
enableFont Boolean true 控制是否启用 enableFont 行为。 enableFont: true
enableFontSize Boolean true 控制是否启用 enableFontSize 行为。 enableFontSize: true
enableFormat Boolean true 控制是否启用 enableFormat 行为。 enableFormat: true
enableLinks Boolean true 控制是否启用 enableLinks 行为。 enableLinks: true
enableLists Boolean true 控制是否启用 enableLists 行为。 enableLists: true
enableSourceEdit Boolean true 控制是否启用 enableSourceEdit 行为。 enableSourceEdit: true
extraFieldBodyCls Mixed Ext.baseCSSPrefix + 'html-editor-wrap' 配置 extraFieldBodyCls 对应的 CSS 类名。 extraFieldBodyCls: Ext.baseCSSPrefix + 'html-editor-wrap'
fieldCls String - 配置 fieldCls 对应的 CSS 类名。 fieldCls: "示例值"
focusCls String - 配置 focusCls 对应的 CSS 类名。 focusCls: "示例值"
fontFamilies Array [ 配置组件的 fontFamilies 选项。 fontFamilies: [
hideMode String 'offsets' 配置组件的 hideMode 选项。 hideMode: 'offsets'
iframePad Number 3 配置组件的 iframePad 选项。 iframePad: 3
initialized Boolean false 控制是否启用 initialized 行为。 initialized: false
inputType String - 配置组件的 inputType 选项。 inputType: "示例值"
invalidCls String - 配置 invalidCls 对应的 CSS 类名。 invalidCls: "示例值"
invalidText String - 配置组件的 invalidText 选项。 invalidText: "示例值"
maskOnDisable Boolean true 控制是否启用 maskOnDisable 行为。 maskOnDisable: true
readOnly String - 控制字段是否只读。 readOnly: "示例值"
reStripQuotes Mixed /^['"]*|['"]*$/g 配置组件的 reStripQuotes 选项。 reStripQuotes: /^['"]*|['"]*$/g
sourceEditMode Boolean false 控制是否启用 sourceEditMode 行为。 sourceEditMode: false
stretchInputElFixed Boolean true 控制是否启用 stretchInputElFixed 行为。 stretchInputElFixed: true
subTplInsertions Array [ 配置组件的 subTplInsertions 选项。 subTplInsertions: [
tabIndex String - 配置组件的 tabIndex 选项。 tabIndex: "示例值"

方法

方法 参数 说明 调用示例
initComponent `` 初始化组件及其子项。 执行时会保留父类默认行为、更新 items、layout 状态。源码涉及 addEvents()、createToolbar()、createInputCmp()、callParent()。 component.initComponent()
createInputCmp `` 创建 inputCmp。 执行时会更新 inputCmp 状态。源码涉及 getInputCmpCfg()。 component.createInputCmp()
getInputCmpCfg `` 读取并返回 inputCmpCfg。源码涉及 getInsertionRenderData()、getTpl()。 component.getInputCmpCfg()
createToolbar `` 创建 toolbar。 执行时会更新 toolbar 状态。源码涉及 getToolbarCfg()。 component.createToolbar()
getToolbarCfg `` 读取并返回 toolbarCfg。 执行时会更新 fontSelect 状态。源码涉及 relayCmd()、deferFocus()、up()、execCmd()。 component.getToolbarCfg()
getMaskTarget `` 读取并返回 maskTarget。 component.getMaskTarget()
setReadOnly readOnly 设置 readOnly。 执行时会更新 readOnly 状态。源码涉及 getEditorBody()、setDesignMode()、disableItems()。 component.setReadOnly(...)
getDocMarkup `` 读取并返回 docMarkup。 component.getDocMarkup()
getEditorBody `` 读取并返回 editorBody。源码涉及 getDoc()。 component.getEditorBody()
getDoc `` 读取并返回 doc。源码涉及 getWin()。 component.getDoc()
getWin `` 读取并返回 win。 component.getWin()
initDefaultFont `` 初始化 defaultFont。 执行时会更新 defaultFont 状态。源码涉及 down()。 component.initDefaultFont()
isEqual value1, value2 判断 equal 状态。源码涉及 isEqualAsString()。 component.isEqual(...)
afterRender `` 生成 after 的渲染结果。 执行时会保留父类默认行为、更新 iframeEl、textareaEl 状态。源码涉及 callParent()、initDefaultFont()。 component.afterRender()
initFrameDoc `` 初始化 frameDoc。 执行时会更新 win 状态。源码涉及 getDoc()、getWin()、getDocMarkup()、setDesignMode()。 component.initFrameDoc()
checkDesignMode `` 处理 checkDesignMode 操作。源码涉及 getDoc()、getDesignMode()、initFrameDoc()。 component.checkDesignMode()
setDesignMode mode 设置 designMode。源码涉及 getDoc()。 component.setDesignMode(...)
getDesignMode `` 读取并返回 designMode。源码涉及 getDoc()。 component.getDesignMode()
disableItems disabled 禁用 items。源码涉及 getToolbar()。 component.disableItems(...)
toggleSourceEdit sourceEditMode 切换 sourceEdit。 执行时会派发 editmodechange 事件、刷新界面或布局、同步关联状态、更新 sourceEditMode、inputEl 状态。源码涉及 getToolbar()、disableItems()、syncValue()、pushValue()。 component.toggleSourceEdit(...)
createLink `` 创建 link。源码涉及 relayCmd()。 component.createLink()
setValue value 设置 value。源码涉及 pushValue()。 component.setValue(...)
cleanHtml html 处理 cleanHtml 操作。 component.cleanHtml(...)
syncValue `` 同步 value。 执行时会派发 beforesync、sync 事件。源码涉及 getEditorBody()、cleanHtml()、fireEvent()、checkChange()。 component.syncValue()
getValue `` 读取并返回 value。 执行时会同步关联状态、更新 value 状态。源码涉及 syncValue()。 component.getValue()
pushValue `` 写入 value。 执行时会派发 beforepush、push 事件。源码涉及 fireEvent()、getEditorBody()、setDesignMode()。 component.pushValue()
deferFocus `` 处理 deferFocus 操作。源码涉及 focus()。 component.deferFocus()
getFocusEl `` 读取并返回 focusEl。 component.getFocusEl()
focus selectText, delay 将焦点移动到组件。 执行时会更新 focusTask 状态。源码涉及 execCmd()、getFocusEl()。 component.focus(...)
initEditor `` 初始化 editor。 执行时会派发 initialize 事件、更新 savedSelection、initialized 状态。源码涉及 getEditorBody()、getDoc()、pushValue()、setReadOnly()。 component.initEditor()
beforeDestroy `` 在 destroy 前执行预处理。 执行时会保留父类默认行为。源码涉及 getDoc()、callParent()。 component.beforeDestroy()
onRelayedEvent event 处理 relayedEvent 回调。 component.onRelayedEvent(...)
onFirstFocus `` 处理 firstFocus 回调。 执行时会派发 activate 事件、更新 activated 状态。源码涉及 disableItems()、getValue()、getEditorBody()、deferFocus()。 component.onFirstFocus()
adjustFont btn 调整 font。源码涉及 getDoc()、relayCmd()。 component.adjustFont(...)
onEditorEvent e 处理 editorEvent 回调。源码涉及 updateToolbar()。 component.onEditorEvent(...)
updateToolbar `` 更新 toolbar。 执行时会同步关联状态。源码涉及 onFirstFocus()、getToolbar()、getDoc()、syncValue()。 component.updateToolbar()
relayBtnCmd btn 转发 btnCmd。源码涉及 relayCmd()。 component.relayBtnCmd(...)
relayCmd cmd, value 转发 cmd。源码涉及 execCmd()、updateToolbar()。 component.relayCmd(...)
execCmd cmd, value 处理 execCmd 操作。 执行时会同步关联状态。源码涉及 getDoc()、syncValue()。 component.execCmd(...)
applyCommand e 应用 command。源码涉及 execCmd()、deferFocus()。 component.applyCommand(...)
insertAtCursor text 处理 insertAtCursor 操作。 执行时会同步关联状态。源码涉及 getDoc()、syncValue()、deferFocus()、execCmd()。 component.insertAtCursor(...)
focusOn callback 将焦点移动到 on。源码涉及 getDoc()、deferFocus()、execCmd()。 component.focusOn(...)
getToolbar `` 读取并返回 toolbar。 component.getToolbar()

事件

事件 说明 监听示例
activate Fires when the editor is first receives the focus. Any insertion must wait until after this event. listeners: { activate: function () {} }
beforepush Fires before the iframe editor is updated with content from the textarea. Return false to cancel the push. listeners: { beforepush: function () {} }
beforesync Fires before the textarea is updated with content from the editor iframe. Return false to cancel the sync. listeners: { beforesync: function () {} }
blur 组件失去焦点时触发。 源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。 listeners: { blur: function () {} }
editmodechange Fires when the editor switches edit modes listeners: { editmodechange: function () {} }
focus 组件获得焦点时触发。 源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。 listeners: { focus: function () {} }
initialize Fires when the editor is fully initialized (including the iframe) listeners: { initialize: function () {} }
push Fires when the iframe editor is updated with content from the textarea. listeners: { push: function () {} }
specialkey 组件获得特殊按键输入时触发。 源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。 listeners: { specialkey: function () {} }
sync Fires when the textarea is updated with content from the editor iframe. listeners: { sync: function () {} }
Navigation

Type to search…

↑↓ navigate↵ selectEsc close