Dans l'éditeur HTML, par défaut, <p> </p> apparaîtra toujours lorsque vous appuyez sur Entrée. Bien sûr, appuyer sur Maj + Entrée peut ajouter directement <br>, et de nombreuses personnes espèrent qu'appuyer sur Entrée entraînera le retour à la ligne de <br>. au lieu de casser une partie.
Les gens m'ont posé cette question, mais sans écrire de test de code, j'ai pensé que je pouvais la juger et la résoudre en jugeant event.keyCode==13 dans onkeydown. Mais plus tard, j'ai découvert que personne ne semblait être capable de la résoudre avec succès. en utilisant cette méthode. Désolé pour ça ! Pour cette raison, après une étude approfondie, j'ai découvert qu'il existe deux solutions, mais aucune n'est parfaite, mais elle peut fondamentalement répondre aux besoins :
1. Lors de l'initialisation du contenu de l'éditeur, ajoutez "<div></div>"
De cette façon, lorsque vous appuyez sur Entrée, l'éditeur générera directement "<div></div>" au lieu de <p></p>, et vous pourrez simplement retourner à la ligne au lieu du paragraphe, comme indiqué ci-dessous :
| Voici le contenu cité : <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"//Ouvrir le mode d'édition idEditbox.document.write(sz) //Le code suivant est simplement destiné à vous aider à visualiser le code source de l'éditeur idEditbox.document.attachEvent ( " onkeyup" , readsource ); idEditbox.document.attachEvent( "onkeydown" , readsource );}//Regardez la fonction du code source readsource(){ document.all.source.value=idEditbox.document.body.innerHTML; }//- -></SCRIPT><BODY ><iframe width="500" height="400" id="idEditbox"></iframe><BR><INPUT TYPE="button" value="Voir la source code" >< BR><TEXTAREA NAME="source" ROWS="20" COLS="60"></TEXTAREA></BODY> |
insuffisant:
Un bug avec cette méthode est qu'après avoir ajouté du contenu dans l'éditeur, sélectionnez tout (ctr+A) puis supprimez tout le contenu (cela supprimera également <div></div>), saisissez à nouveau le contenu et appuyez sur Entrée. . Produira toujours <p></p>
2. Traitez-le directement dans onkeypress
Nous pouvons sortir directement dans onkeypress, mais en jugeant event.keyCode==13, c'est-à-dire en appuyant sur Entrée, nous insérons directement la balise <br>, afin qu'aucun problème ne se produise quoi qu'il arrive. Voici un exemple de code :
| Voici le contenu cité : <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(){ //Remarque : Cette fonction ne fonctionnera pas si le focus n'est pas dans l'éditeur ; var ev = idEditbox.event; keyCode==13){ insertHTML("<br><!-- -->"); //Je ne sais pas si c'est un problème avec mon navigateur ou autre chose. Seule la balise <br> est insérée et le. le curseur ne s'enroule pas. Vous devez attacher d'autres balises, vous pouvez les supprimer ensemble à la fin return false;//De cette façon, le retour chariot équivaut à invalid et la balise ennuyeuse <p> ne sera pas ajoutée}} //Insérer une fonction HTML à la position du curseur insertHTML(html){var sel = idEditbox.document selection;if (sel!=null) { var rng = sel.createRange(); (html);}}//Afficher la fonction de code readsource(){ document.all.source. value=idEditbox.document.body.innerHTML;}//--></SCRIPT><BODY ><iframe width="500 " height="400" id="idEditbox"></iframe><BR><INPUT TYPE="bouton" value="Afficher le code source" ><BR><TEXTAREA NAME="source" ROWS="20" COLS ="60"></TEXTAREA></BODY> |
insuffisant:
1).insertHTML("<br><!-- -->"); générera du code poubelle "<!-- -->";
2) Pour garantir que le focus doit être dans l'éditeur afin de répondre à l'événement onkeypress de l'éditeur, en raison de contraintes de temps, cet exemple de programme ne fournit pas de méthode de traitement lorsque le focus n'est pas dans l'éditeur.