我正在练习做一个论坛网站,但是那个“发帖和回复帖子的在线HTML编辑器”是怎么做出来的? 刚开始我想到用iframe来做,但是发现,虽然iframe能够把所有的东西(图片、文本、视频等)都放在上面,但注意到:iframe并不是<input type="text"/>标签,在网页上如果有一个iframe,用户是不能在它上面编辑文字的,而如果是一个<input type="text"/>,用户就能在它上面编辑文字了。那么怎么才能在iframe上面编辑文字呢? 看到许多论坛发帖回帖的那个窗口,就是能在上面编辑文字的,难道这个编辑窗口不是 iframe 而是 <input type="text"/> ?如果是,那么它又如何能够插入图片、视频等?难道说要另外使用一个 <div > 来容纳<img >或<iframe>,然后在插入到这个 <input type="text"/> ?那么这些图片、视频等与 <input type="text"/>中的文字的位置关系如何确定?也就是图文混排的实现,这可是大工程哦。 于是,用firefox观察发帖回帖的那个窗口的html源代码,看到那个窗口确实是iframe,那也奇怪了,难道iframe真的允许用户直接在它上面编辑文字吗? 请各位高手快快指点,感激不尽啊!
嗯,我想一个一个来试试看。
先看一下sohighthesky的“contentEditable="true"后可以直接编辑”,刚才试了一下:<iframe contentEditable="true" id="if1" > </iframe> 还是没能在iframe里面编辑文本哦,能否给个简洁的实例看一下?谢谢!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><body id="bd1" contentEditable="true">
<img _moz_dirty="" src="http://album.hi.csdn.net/app_uploads/wtcsy/20090719/220846596.p.gif"/>
hello!
</body></html>那么我想把body里面的内容:
<img _moz_dirty="" src="http://album.hi.csdn.net/app_uploads/wtcsy/20090719/220846596.p.gif"/>
hello!
提取出来存入数据库中,作为帖子的html源码。还请指点如何提取body中的内容?谢谢!
谢谢大家的热情帮助!