Heim > Web-Frontend > js-Tutorial > 在线编辑器的实现原理(兼容IE和FireFox)_javascript技巧

在线编辑器的实现原理(兼容IE和FireFox)_javascript技巧

WBOY
Freigeben: 2016-05-16 19:17:21
Original
1271 Leute haben es durchsucht

在线编辑器在我们日常的项目开发中非常有用(如新闻系统),它可以方便地实现文章的在线编辑,省掉了FrontPage等工具。那么是怎样实现浏览器在线编辑功能的呢?  首先需要IE的支持,在IE5.5以后就有一个编辑状态. 就是利用这个编辑状态,然后用javascript来控制在线编辑的。 
     首先要有一个编辑框,这个编辑框其实就是一个可编辑状态的网页, 我们用iframe来建立编辑框。
      
     并且在加上javascript代码来指定HtmlEdit有编辑功能(下面提供完整的原代码):

复制代码 代码如下:

<script> <BR> var editor; <BR> editor = document.getElementById("HtmlEdit").contentWindow; <br><br> //只需键入以下设定,iframe立刻变成编辑器。 <BR> editor.document.designMode = 'On'; <BR> editor.document.contentEditable = true; <br><br> //但是IE与FireFox有点不同,为了兼容FireFox,所以必须创建一个新的document。 <BR> editor.document.open(); <BR> editor.document.writeln('<html><body></script>
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage