在线编辑器原理 这是一个以前写的帖子. 关于研究在线编辑器原理的文章. 很多人都用过这样或那样的在线编辑器.比较有名的国产在线编辑器有 ewebsoft ,但为什么能实现在线编辑呢? 首先需要 ie 的支持,在 ie 5.5 以后就有一个编辑状态. 就是利用这个编辑状态,然后用 javascript 来控制 在线编辑的. 下面给出一个简短的例子: 首先要有一个编辑框.这个编辑框其实就是一个 可编辑状态的 网页. 我们这里用 iframe 来建立编辑框 并且在 加上 javascript 代码来指定 HtmlEdit 有编辑功能: function document.onreadystatechange() { HtmlEdit.document.designMode="On"; } HtmlEdit.document.body.innerHTML 这句可以获得 HtmEdit 里面的html 代码. 一般的我们会用这样的 javascript 将 iframe 里的内容传递给一个 textarea 然后提交给服务器处理. function getIframeData(){ document.form1.test.value=HtmlEdit.document.body.innerHTML; } function sentIframeData(){ HtmlEdit.document.body.innerHTML=document.form1.test.value; } var sel = HtmlEdit.document.selection.createRange(); 而这一句可以获得选取的焦点: 下面我就演示一个完成的例子. 一个拥有加粗功能的在线编辑器,有兴趣的朋友可以在此基础上完成其他功能!!
