No editor HTML, por padrão, <p> </p> sempre aparecerá ao pressionar Enter. É claro que pressionar shift+enter pode adicionar <br> diretamente, e muitas pessoas esperam que pressionar Enter faça com que <br> seja quebrado. em vez de quebrar parte.
As pessoas têm me feito essa pergunta, mas sem escrever um teste de código, pensei que poderia julgá-lo e resolvê-lo julgando event.keyCode==13 em onkeydown. Mas depois descobri que ninguém parecia ser capaz de resolvê-lo com sucesso. usando este método. Desculpe por isso! Por isso, após um estudo cuidadoso, descobri que existem duas soluções, mas nenhuma é perfeita, mas pode basicamente atender às necessidades:
1. Ao inicializar o conteúdo do editor, adicione "<div></div>"
Desta forma, ao pressionar Enter, o editor irá gerar diretamente "<div></div>" em vez de <p></p>, e você pode simplesmente quebrar a linha em vez do parágrafo, conforme mostrado abaixo:
| A seguir está o conteúdo citado: <SCRIPT LANGUAGE="javascript"><!--function initeditor(){ var L_DEFAULTHTML_TEXT="<DIV></DIV>"; +L_DEFAULTHTML_TEXT+"</BODY>" idEditbox.document.designMode="on"//Abrir modo de edição idEditbox.document.write(sz) //O código a seguir é apenas para auxiliar na visualização do código-fonte do editor idEditbox.document.attachEvent ( " onkeyup" , readsource ); idEditbox.document.attachEvent( "onkeydown" , readsource );}//Veja a função do código-fonte readsource(){ document.all.source.value=idEditbox.document.body.innerHTML; }//- -></SCRIPT><BODY ><iframe width="500" height="400" id="idEditbox"></iframe><BR><INPUT TYPE="button" value="Ver código-fonte código"><BR><TEXTAREA NAME="source" ROWS="20" COLS="60"></TEXTAREA></BODY> |
insuficiente:
Um bug desse método é que após adicionar algum conteúdo no editor, selecione tudo (ctr+A) e então exclua todo o conteúdo (isso também excluirá <div></div>), digite novamente o conteúdo e pressione Enter . Ainda produzirá <p></p>
2. Processe-o diretamente no onkeypress
Podemos sair diretamente no onkeypress, mas ao julgar event.keyCode==13, ou seja, ao pressionar Enter, inserimos diretamente a tag <br>, para que nenhum problema ocorra, aconteça o que acontecer. Aqui está um exemplo de código:
| A seguir está o conteúdo citado: <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(){ //Nota: Esta função não funcionará se o foco não estiver no editor; keyCode==13){ insertHTML("<br><!-- -->"); //Não sei se é um problema com meu navegador ou outra coisa. o cursor não quebra. Você deve anexar outras tags, você pode excluí-las juntas no final return false; // Dessa forma, o retorno de carro é equivalente a inválido e a irritante tag <p> não será adicionada}} //Inserir função html na posição do cursor insertHTML(html){var sel = idEditbox.document selection;if (sel!=null) { var rng = sel.createRange(); (html);}}//Ver função de código readsource(){ document.all.source. value=idEditbox.document.body.innerHTML;}//--></SCRIPT><BODY ><iframe width="500 " height="400" id="idEditbox"></iframe><BR><INPUT TYPE="button" value="Ver código fonte" ><BR><TEXTAREA NAME="source" ROWS="20" COLS ="60"></TEXTAREA></BODY> |
insuficiente:
1).insertHTML("<br><!-- -->");
2) Para garantir que o foco deve estar no editor para responder ao evento onkeypress do editor, devido a restrições de tempo, este programa de amostra não fornece um método de processamento quando o foco não está no editor.