2012-12-18 40 views
0
<html> 
<head> 
<title>Rich Text Editor</title> 
</head> 
<body onLoad="def()"><center> 
<div style="width:500px; text-align:left; margin-bottom:10px "> 
<input type="button" id="bold" style="height:21px; width:21px; font-weight:bold;" value="B" onClick="fontEdit('bold')" /> 
<input type="button" id="italic" style="height:21px; width:21px; font-style:italic;" value="I" onClick="fontEdit('italic')" /> 
<input type="button" id="underline" style="height:21px; width:21px; text-decoration:underline;" value="U" onClick="fontEdit('underline')" /> | 
<input type="button" style="height:21px; width:21px;"value="L" onClick="fontEdit('justifyleft')" title="align left" /> 
<input type="button" style="height:21px; width:21px;"value="C" onClick="fontEdit('justifycenter')" title="center" /> 
<input type="button" style="height:21px; width:21px;"value="R" onClick="fontEdit('justifyright')" title="align right" /> | 
<select id="fonts" onChange="fontEdit('fontname',this[this.selectedIndex].value)"> 
<option value="Arial">Arial</option> 
<option value="Comic Sans MS">Comic Sans MS</option> 
<option value="Courier New">Courier New</option> 
<option value="Monotype Corsiva">Monotype</option> 
<option value="Tahoma">Tahoma</option> 
<option value="Times">Times</option> 
</select> 
<select id="size" onChange="fontEdit('fontsize',this[this.selectedIndex].value)"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
</select> 
<select id="color" onChange="fontEdit('ForeColor',this[this.selectedIndex].value)"> 
<option value="black">-</option> 
<option style="color:red;" value="red">-</option> 
<option style="color:blue;" value="blue">-</option> 
<option style="color:green;" value="green">-</option> 
<option style="color:pink;" value="pink">-</option> 
</select> | 
<input type="button" style="height:21px; width:21px;"value="1" onClick="fontEdit('insertorderedlist')" title="Numbered List" /> 
<input type="button" style="height:21px; width:21px;"value="?" onClick="fontEdit('insertunorderedlist')" title="Bullets List" /> 
<input type="button" style="height:21px; width:21px;"value="?" onClick="fontEdit('outdent')" title="Outdent" /> 
<input type="button" style="height:21px; width:21px;"value="?" onClick="fontEdit('indent')" title="Indent" /> 
</div> 
<iframe id="textEditor" style="width:500px; height:170px;"> 
</iframe> 
</center> 
<script type="text/javascript"> 
<!-- 
textEditor.document.designMode="on"; 
textEditor.document.open(); 
textEditor.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px;}</style></head>'); 
textEditor.document.close(); 
function def() 
{ 
document.getElementById("fonts").selectedIndex=0; 
document.getElementById("size").selectedIndex=1; 
document.getElementById("color").selectedIndex=0; 
} 
function fontEdit(x,y) 
{ 
textEditor.document.execCommand(x,"",y); 
textEditor.focus(); 
} 
--> 
</script> 
</body> 
</html> 

我在線瀏覽了這些代碼。但我不能讓它在Firefox上工作。我已經閱讀了關於這個編輯器的一些評論,並且指出它可能歸因於iframe。富文本編輯器不能在Firefox上工作

這裏是我的源是否會有所幫助,text editor link

預先感謝您。

回答

0
<html> 
    <head> 
     <title>Rich Text Editor</title> 
    </head> 

    <script type="text/javascript"> 
    function def() 
    { 
     document.getElementById("textEditor").contentWindow.document.designMode="on"; 
     textEditor.document.open(); 
     textEditor.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px;}</style></head>'); 
     textEditor.document.close(); 
     document.getElementById("fonts").selectedIndex=0; 
     document.getElementById("size").selectedIndex=1; 
     document.getElementById("color").selectedIndex=0; 
    } 
    function fontEdit(x,y) 
    { 
     document.getElementById("textEditor").contentWindow.document.execCommand(x,"",y); 
     textEditor.focus(); 
    } 
    </script> 

    <body onLoad="def()"> 
     <center> 
      <div style="width:500px; text-align:left; margin-bottom:10px "> 
       <input type="button" id="bold" style="height:21px; width:21px; font-weight:bold;" value="B" onClick="fontEdit('bold')" /> 
       <input type="button" id="italic" style="height:21px; width:21px; font-style:italic;" value="I" onClick="fontEdit('italic')" /> 
       <input type="button" id="underline" style="height:21px; width:21px; text-decoration:underline;" value="U" onClick="fontEdit('underline')" /> | 
       <input type="button" style="height:21px; width:21px;"value="L" onClick="fontEdit('justifyleft')" title="align left" /> 
       <input type="button" style="height:21px; width:21px;"value="C" onClick="fontEdit('justifycenter')" title="center" /> 
       <input type="button" style="height:21px; width:21px;"value="R" onClick="fontEdit('justifyright')" title="align right" /> | 
       <select id="fonts" onChange="fontEdit('fontname',this[this.selectedIndex].value)"> 
        <option value="Arial">Arial</option> 
        <option value="Comic Sans MS">Comic Sans MS</option> 
        <option value="Courier New">Courier New</option> 
        <option value="Monotype Corsiva">Monotype</option> 
        <option value="Tahoma">Tahoma</option> 
        <option value="Times">Times</option> 
       </select> 
       <select id="size" onChange="fontEdit('fontsize',this[this.selectedIndex].value)"> 
        <option value="1">1</option> 
        <option value="2">2</option> 
        <option value="3">3</option> 
        <option value="4">4</option> 
        <option value="5">5</option> 
       </select> 
       <select id="color" onChange="fontEdit('ForeColor',this[this.selectedIndex].value)"> 
        <option value="black">-</option> 
        <option style="color:red;" value="red">-</option> 
        <option style="color:blue;" value="blue">-</option> 
        <option style="color:green;" value="green">-</option> 
        <option style="color:pink;" value="pink">-</option> 
       </select> | 
       <input type="button" style="height:21px; width:21px;"value="1" onClick="fontEdit('insertorderedlist')" title="Numbered List" /> 
       <input type="button" style="height:21px; width:21px;"value="?" onClick="fontEdit('insertunorderedlist')" title="Bullets List" /> 
       <input type="button" style="height:21px; width:21px;"value="?" onClick="fontEdit('outdent')" title="Outdent" /> 
       <input type="button" style="height:21px; width:21px;"value="?" onClick="fontEdit('indent')" title="Indent" /> 
      </div> 
      <iframe id="textEditor" style="width:500px; height:170px;"> 
      </iframe> 
     </center> 

    </body> 
</html> 
+0

非常感謝:D – jamie