FckEditor有一个Word黏贴功能,不过如果Word中包含图片,则图片是不能显示的,因为图片不能自动上传到服务器,正好最近做的一个项目有这个需求,就研究了一下如何实现类似eWebEditor的Word文档的导入,我所用的是DNN4.8.4和它自带的FckEditor。要实现这个功能主要分这几步:1.给FckEditor添加导入按钮 2.在弹出的对话框中实现上传Word文件,保存到服务器端 3.将服务器端Word文档转换成Html,分离出样式,并将图片路径替换为正确的虚拟路径 4.将转换后的Html返回给FckEditor。 下面简要说明并提供代码(写的很土):
1.给FckEditor添加导入按钮
我是参照这里的,说的很详细:http://www.hiisee.com/modules/Blog/index.php?action=showTopic&id=fckeditor-custom-toolbar
其中功能的实例化改成这样:
case 'ImportWord':B=new FCKDialogCommand('ImportWord',FCKLang.ImportWord,'http://www.cnblogs.com/ImportWord/ImportWord.aspx',700,600);break;
2,3两部是通过ImportWord.aspx页面来实现的,具体代码就不贴了。
4.返回的代码我参照了FckEditor的插入Table的实现方法,类似的还有很多,所以很容易就可以写出来,我是写在ImportWord.aspx里面的,主要用到:
var oActiveEl = oEditor.FCK.EditorDocument.createElement( 'SPAN' ) ;
oActiveEl = oEditor.FCK.InsertElement( oActiveEl ) ;
这样就完成了,但上传文件时可能会出现权限错误,只需要在web.config的<system.web>节点加入<identity impersonate="true"/>就可以解决。下面就是源代码,安装的方法是加压后直接覆盖原来的Fck目录,将Microsoft.Office.Interop.Word.dll复制到DNN的Bin目录下
主要增加的文件有:ImportWord.aspx、 ImportWord.aspx.cs
主要修改的文件有:Fck\Custom\Fckconfig.js、Fck\FCKeditor\editor\js\fckeditorcode_ie.js、Fck\FCKeditor\editor\skins\office2003\fck_strip.gif、Fck\FCKeditor\editor\lang\en.js、Fck\FCKeditor\editor\lang\zh-cn.js 、web.config
下载:
HtmlEditorProviders.rar