在html編輯器中，一般預設按回車總是出現<p> </p>，當然按shift+enter可以是直接加<br>，而很多人希望按回車就是<br>換行而不是分段。
一直有人問我這個問題，而我沒有寫程式碼測試就認為在onkeydown裡面判斷event.keyCode==13就可以判斷並解決，而後來發現似乎沒有人能用這種方法解決成功。對此表示歉意！為此，仔細研究了一下，發現可以有兩種解決方法，但是都不是很完美，不過已經基本上可以滿足需求了：
1.初始化編輯器內容的時候，加上"<div></div>"
這樣回車的時候編輯器會直接產生"<div></div>"而不會產生<p></p>，就可以只是換行而不換段了，如下所示：
| 以下為引用的內容： <SCRIPT LANGUAGE="javascript"><!--function initeditor(){ var L_DEFAULTHTML_TEXT="<DIV></DIV>"; var sz="" sz+="<BODY ONCONTEXTMENU="return false">" +L_DEFAULTHTML_TEXT+"</BODY>" idEditbox.document.designMode="on"//編輯模式開啟idEditbox.document.write(sz) //以下程式碼只是輔助方便看編輯器原始碼的idEditbox.document.attachEvent( " onkeyup" , readsource ); idEditbox.document.attachEvent( "onkeydown" , readsource );}//看原始碼function readsource(){ document.all.source.value=idEditbox.document.body.innerHTML;}//- -></SCRIPT><BODY ><iframe width="500" height="400" id="idEditbox"></iframe><BR><INPUT TYPE="button" value="查看原始碼" >< BR><TEXTAREA NAME="source" ROWS="20" COLS="60"></TEXTAREA></BODY> |
不足：
這種方法有個bug就是在編輯器中加入一些內容後，全選（ctr+A）然後刪除所有內容（這樣就把<div></div>也刪除了），重新輸入內容後回車就還是會產生<p></p>
2.直接在onkeypress裡面處理
我們可以在onkeypress裡面直接出來，但判斷event.keyCode==13也就是是回車的時候我們直接插入<br>標籤，這樣無論怎麼樣都不會出現問題的了。以下是程式碼範例：
| 以下為引用的內容： <SCRIPT LANGUAGE="javascript"><!--function initeditor(){ var sz="" sz+="<BODY ONCONTEXTMENU="return false"></BODY>" idEditbox.document.designMode="on" idEditbox.document.write(sz) idEditbox.document.onkeypress=fnKeypress}function fnKeypress(){ //注意：如果焦點不在編輯器內該函數就不起作用了； var ev = idEditbox.event; if(ev. keyCode==13){ insertHTML("<br><!-- -->"); //不知道是我瀏覽器問題還是其他問題，只插入<br>標籤遊標不換行，必須附加點其他標籤，可以最後一起刪除之return false;//這樣回車就是等於失效了，不會加上討厭的<p>標籤}}//在遊標位置插入htmlfunction insertHTML(html){var sel = idEditbox.document. selection;if (sel!=null) { var rng = sel.createRange(); if (rng!=null) rng.pasteHTML(html);}}//檢視程式碼function readsource(){ document.all.source. value=idEditbox.document.body.innerHTML;}//--></SCRIPT><BODY ><iframe width="500" height="400" id="idEditbox"></iframe><BR><INPUT TYPE="button" value="查看原始碼" ><BR><TEXTAREA NAME="source" ROWS="20" COLS="60"></TEXTAREA></BODY> |
不足：
1).insertHTML("<br><!-- -->"); 會產生垃圾程式碼「<!-- -->」;
2).要確保焦點必須在編輯器中才能回應編輯器的onkeypress事件因時間關係，本範例程式並未給出焦點不在編輯器中的處理方法