HTML在线编辑器不需要懂得使用Dreamweaver，会用Word就会使用

　　HTML在线编辑器不需要懂得使用Dreamweaver，会用Word就会使用

　　HTML 在线编辑器不需要知道如何使用 Dreamweaver，如果您会使用 Word，您将使用此编辑器。在文章系统或需要在新闻系统中进行文本编辑的web程序中非常有用。

　　但是如何将html编辑器嵌入到网页中以及如何获取里面的数据呢？ ！

　　首先，我们假设我们要调用的HTML在线编辑器放在一个单独的页面中，文件名为 gledit.htm。图片上传首页：.

　　HTML 在线编辑器有两种基本调用方式

　　一、使用对象调用()：

　　1、如何在网页中嵌入html编辑器：我们在需要嵌入的地方添加如下html代码：

　　object标签中data后面的data就是我们要调用的在线编辑器页面的路径，id就是我们调用object的id，后面在编辑器中取数据的时候会用到。 width 和 height 是编辑器的高度和宽度。

　　2、如何在html编辑器中获取数据：我们把所有需要提交的内容放在一个表单中，object调用的编辑器也放在这个表单中，我们可以设置一个隐藏的text area(or)用于提交时临时保存html在线编辑器的数据。因为在asp或jsp、php中无法直接获取表单中对象的内容，所以必须使用隐藏文本区域来获取数据。我们在提交表单时将对象的内容复制到隐藏文本区域。详细代码如下：

　　这样，在后台处理页面，我们就可以通过取隐藏区域内容的数据直接获取html在线编辑器的数据了。

　　3、如何将文本编辑器中的原生图片上传到html在线编辑器：首先，我们在点击按钮插入图片时弹出一个图片上传窗口，我们使用自己的程序上传本地图片在服务器上，然后我们需要记录图片的路径，然后在html在线编辑器的值中添加显示图片的html标签。详细说明及代码如下：

　　在编辑器中，我们为插入图片的按钮添加一个事件οonclick="window.open('img_upload.asp','img_upload','width=481 height=190')">in'img_upload。 asp'我们把提交的图片上传到服务器做一个目录，记录图片路径

　　这样就可以方便的将上传的图片插入到编辑器中了。

　　4、编辑时如何调用HTML在线编辑器修改数据文章：当我们添加HTML在线编辑器修改数据并提交到数据库时，我们还需要能够上传database 内容使用HTML在线编辑器修改数据。首先，我们在表单中添加一个隐藏区域来放置数据库中的内容。例如，注意我们使用隐藏的textarea而不是隐藏的输入，因为数据可能收录回车和换行，所以如果我们使用> ">可能会因为换行而出现非常HTML错误（值=后面的数据必须保证要在一行，否则会报错）。然后按照上面描述的方法使用对象调用HTML在线编辑器，方法和代码和上面一样，现在我们要做的其实就是是提交的逆过程，我们只需要将隐藏文本区的内容复制到HTML在线编辑器中，这里我们将其添加到body中，这样页面加载时就可以放置数据库中的内容了。在HTML在线编辑器中，提交过程与上述相同，这里不再赘述。

　　二、使用iframe调用()

　　1、如何嵌入网页：我们在需要嵌入的地方添加如下html代码：“src=”后面的数据就是我们要调用的在线编辑器页面的路径，而id就是我们调用的IFRAME，id、Width和height就是编辑器的高度和宽度。

　　2、如何在html编辑器中获取数据：同理，我们把所有需要提交的内容放在一个表单中，并且可以设置一个隐藏的文本区域（或者）在提交的时候暂时保存为html在线编辑器的数据，我们使用隐藏文本区域来获取数据。我们在提交表单时将对象的内容复制到隐藏文本区域。详细代码如下：

　　函数 subchk(cmd)

　　{

　　document.form1.content.value=window.content_html.getHTML();

　　}

　　在后台处理页面，我们可以通过取隐藏区域内容的数据直接获取html在线编辑器的数据。

　　2、如何在html编辑器中获取数据：我们把所有需要提交的内容放在一个表单中，object调用的编辑器也放在这个表单中，我们可以设置一个隐藏的text area(or)用于提交时临时保存html在线编辑器的数据。因为在asp或jsp、php中无法直接获取表单中对象的内容，所以必须使用隐藏文本区域来获取数据。我们在提交表单时将对象的内容复制到隐藏文本区域。详细代码如下：

　　这样，在后台处理页面，我们就可以通过取隐藏区域内容的数据直接获取html在线编辑器的数据了。

　　3、如何将文本编辑器中的原生图片上传到html在线编辑器：首先，我们在点击按钮插入图片时弹出一个图片上传窗口，我们使用自己的程序上传本地图片在服务器上，然后我们需要记录图片的路径，然后通过在网页中编写一个调用html在线编辑器的函数，插入一个显示图片在光标位置的html标签。详细说明及代码如下：

　　在编辑器中，我们给插入图片的按钮添加一个事件 οonclick="window.open('img_upload.asp','img_upload','width=481 height=190')">在页面中编辑器被调用在我们定义了将html代码插入编辑器的函数

　　在处理上传图片的文件中，我们调用父窗口的函数插入html代码

　　这样就可以方便的将上传的图片插入到编辑器中了。

　　4、编辑时如何调用HTML在线编辑器修改数据文章：当我们添加HTML在线编辑器修改数据并提交到数据库时，我们还需要能够上传database 内容使用HTML在线编辑器修改数据。首先，我们在表单中添加一个隐藏区域来放置数据库中的内容。比如这里我们在调用编辑器的页面的body标签中添加inserthtml()。 Inserthtml() 是我们定义的将html代码插入编辑器的函数。 （具体请参考插入图片的代码）。这样，当页面加载时，可以在HTML在线编辑器中编辑数据库中的内容。提交过程同上，这里不再赘述。

　　这里只是简单介绍一下如何调用html在线编辑器。具体代码就不一一列举了。在整理过程中，如果您对文章中的内容有任何问题或建议，请联系我连接。

　　第一次写技术文章，乱七八糟！后来懒得整理了，不过可能对有些人有用

　　介绍了如何调用html在线编辑器

　　重点是解决直接上传本地图片到服务器插入html编辑器，编辑文章时调用html编辑器编辑的问题

　　当时把图片上传到服务器的解决方案不是很科学——每次插入本地图片，就上传到服务器一次，无形中给服务器生成了很多垃圾图片

　　后来我们采用了同时插入图片和动态生成的方式，提交时一次性处理所有“需要”上传的图片，并与文章一起生成指定的文件和图片目录

　　如果文章是artile321.htm，对应的图片文件夹在artile321.files。删除文章时，可以同时删除对应的图片文件夹。

　　同时对于粘贴的图片，也可以根据*.alll.tags("img")提取其他网站的所有地址，通过xmlhttp下载到服务器，以免可能失败 访问

　　上面介绍的一些关于html编辑器调用的改进还没来得及整理，最近比较忙：（

　　有什么问题可以一起讨论