本论文是一篇关于多媒体论文格式,关于基于HTML的在线文档编辑器的实现方法相关毕业论文的格式范文。免费优秀的关于多媒体及互联网及参考文献方面论文范文资料,适合多媒体论文写作的大学硕士及本科毕业论文开题报告范文和学术职称论文参考文献下载。
摘 要:基于HTML的在线文档编辑器是几乎所有在线应用系统中信息发布必不可少的功能模块.在线文档编辑器主要用于编辑文字并对其格式化、以及插入各种多媒体对象(图片、音乐、视频、FLASH动画)等等.当前很多在线应用系统的信息发布模块通常采用第三方组件,存在一定的局限与弊端.本文介绍了实现在线文档编辑器的基本方法和技术,从而能够设计与开发出满足性化需求的发布模块.
关 键 词:在线文档编辑器HTML信息发布WEB应用开发
中图分类号:TP311文献标识码:A文章编号:1007-9416(2012)10-0215-02
随着有线或无线互联网的不断发展,各种基于WEB的应用系统不断的改变着人们的工作、生活方式,互联网已经成为人们获取信息的主要方式,WEB应用系统中信息发布必不可少的功能模块是基于HTML的在线文档编辑器.当前绝大多数WEB应用使用的是第三方HTML文档编辑器组件(例如FCKeditor、FreeTextBox、eWebEditor等等),这些组件虽然功能强大、稳定可靠,但由于是通用型组件,在满足个性化或特殊需求上仍然存在一定的局限与不足.本文介绍了实现在线文档编辑器的基本方法和技术,从而能够开发出满足系统个性化的信息发布模块.
1.在线HTML文本编辑器的基本功能
当前WEB应用系统中的在线文档编辑器主要完成如下功能:
(1)文本格式化与排版.包括文字的输入;选定内容的复制、剪切、粘贴、查找、删除、清除格式、取消、重做;文本格式化如字体、字号、文字颜色、背景颜色、加粗、倾斜、下划线、删除线、上标、下标、项目符号等;文档排版如各种对齐方式、段落的缩进控制等.
(2)多媒体对象的插入,如插入图片、音乐、视频、FLASH影片、表情等.
(3)HTML元素对象的插入,如插入超级链接、水平线、表格、文本框、下拉菜单、特殊字符、等等.
同时配合一些文档编辑辅助功能,如预览、查看源代码、保存、打印等,从而使得在线文本编辑能够完成几乎所有互联网信息的编辑与发布功能.
下文将针对文本基本格式化与多媒体对象的插入功能实现方法进行介绍,以抛砖引玉.
2.基本实现方法和技术
2.1在线HTML文本编辑器的基本构成
编辑器界面由编辑功能菜单与文档编辑区两部分构成.
(1)编辑功能菜单包含各种编辑功能按钮,可在主文档中(如果主文档为HTMLEDIT.HTML)利用表格或DIV层来控制其放置的位置.
有关论文范文主题研究: | 关于多媒体的论文范例 | 大学生适用: | 函授毕业论文、学年论文 |
---|---|---|---|
相关参考文献下载数量: | 29 | 写作解决问题: | 怎么撰写 |
毕业论文开题报告: | 论文任务书、论文设计 | 职称论文适用: | 论文发表、中级职称 |
所属大学生专业类别: | 怎么撰写 | 论文题目推荐度: | 优质选题 |
(2)文档编辑区利用内联框架IFrame构成(这里假设IFrame名称为EditField),在内联框架中加载一空白编辑HTML文档(这里假设该文档为Edit.).
同时在主文档加载时,用下面JS代码使得EditField处于可编辑状态:
EditField.document.contentEditable等于true
在主界面中加入一个名为HiddenContent隐藏表单元素,通过下面代码获取文档编辑区域中的内容便于传递给服务器进行存储:
HiddenContent.value等于EditField.document.body.innerHTML;
2.2编辑器中文本的格式化及插入HTML元素
下面通过设置选定文本为红色为例进行说明,其基本步骤如下.
(1)选定欲要格式化的文本:
varrange等于EditField.document.selection.createRange();
(2)判断选定区域的元素类型:
varrangeType等于range.Type;
(3)如果rangeType是Text(文本),则格式化:
EditField.document.execCommand("forecolor",false,"Red");
由上可知,格式化文本主要的方法是execCommand,下面对其基本语法进行简单介绍:
obj.execCommand(sCmd[,bUserInf][,vValue])
sCmd:为字符串值,表示执行的格式化指令.
bUserInf:为可选的boolen类型值,表示是否显示用户界面.
vValue:表示响应格式化命令所需要的参数.
execCommand方法支持的常用指令如下表所示.
execCommand方法通过指定sCmd为HTML元素(例如CreateLink)也可以向文档中插入各种HTML元素,但是如果元素属性过于复杂,可以使用下面介绍的插入多媒体对象的pasteHTML方法来实现.
2.3插入多媒体对象
在新闻信息中,除了文字外,通常还包括图片、音频、FLASH、视频等多媒体信息.
(1)在HTML文本编辑器中插入多媒体信息的主要步骤.
①选定文本或指定插入点:
varrange等于EditField.document.selection.createRange();
②利用对话窗体获取插入对象的相关参数,并将其构造成字符串形式返回编辑器主界面:
varstrObj等于showModalDialog(̶