|
|
首先要有一個(gè)編輯框，這個(gè)編輯框其實(shí)就是一個(gè)可編輯狀態(tài)的網(wǎng)頁(yè)， 我們用iframe來(lái)建立編輯框。
<IFRAME id=“HtmlEdit” style="WIDTH: 100%; HEIGHT: 296px" marginWidth=“0” marginHeight=“0”></IFRAME>
并且在加上Javascript代碼來(lái)指定HtmlEdit有編輯功能(下面提供完整的原代碼)：
復(fù)制代碼 代碼如下:
<script language="Javascript">
var editor;
editor = document.getElementById("HtmlEdit").contentWindow;
//只需鍵入以下設(shè)定，iframe立刻變成編輯器。
editor.document.designMode = 'On';
editor.document.contentEditable = true;
//但是IE與FireFox有點(diǎn)不同，為了兼容FireFox，所以必須創(chuàng)建一個(gè)新的document。
editor.document.open();
editor.document.writeln('<html><body></body></html>');
editor.document.close();
//字體特效 － 加粗方法一
function addBold()
{
editor.focus();
//所有字體特效只是使用execComman()就能完成。
editor.document.execCommand("Bold", false, null);
}
//字體特效 － 加粗方法二
function addBold()
{
editor.focus();
//獲得選取的焦點(diǎn)
var sel = editor.document.selection.createRange();
insertHTML("<b>"+sel.text+"</b>");
}
function insertHTML(html)
{
if (editor.document.selection.type.toLowerCase() != "none")
{
editor.document.selection.clear() ;
}
editor.document.selection.createRange().pasteHTML(html) ;
}
</script>
JavaScript技術(shù)：在線編輯器的實(shí)現(xiàn)原理(兼容IE和FireFox)，轉(zhuǎn)載需保留來(lái)源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
