htmleditorpro使用方法

html-css022

htmleditorpro使用方法,第1张

1、首先在需要嵌入得位置加入以下html代码。

2、其次所有需要提交的内容都放在一个表单里面,同样利用object调用的编辑器也放在这个表单里面,同时可以设置一个隐藏的文本区域(或)用以在提交的时候临时保存html在线编辑器的数据。

3、然后点击插入图片的按钮时弹出一个上传图片的窗口,利用自己写的程序来实现上传本机图片到服务器上,需要记录图片的路径,通过html在线编辑器的值中加入显示图片的html标签。

4、在添加的时候将HTML在线编辑器来修改数据提交到数据库后还需要能将数据库的内容用HTML在线编辑器来修改数据。

Ext禁止编辑HtmlEditor的方法

如果我们想要使用HtmlEditor只是用于显示数据时,需要禁止编辑Ext.form.HtmlEditor。

一般的做法都是通过设置readOnly : true 和disabled : true 但是你会发现,这样的做法根本不起作用。

这里我们需要重写HtmlEditor的disabled方法。

Ext.override(Ext.form.HtmlEditor, {

onDisable: function(){

if(this.rendered){

this.wrap.mask()

}

Ext.form.HtmlEditor.superclass.onDisable.call(this)

},

onEnable: function(){

if(this.rendered){

var roMask = this.wrap.mask()

roMask.dom.style.filter = "alpha(opacity=0)"//IE

roMask.dom.style.opacity = "0"//Mozilla

roMask.dom.style.background = "white"

roMask.dom.style.overflow = "scroll"

}

Ext.form.HtmlEditor.superclass.onEnable.call(this)

}

})