sauts de ligne manquantes lors de l'accès des options dans une boîte de sélection (html) via JavaScript

je le code suivant (code nettoyé pour plus de clarté):sauts de ligne manquantes lors de l'accès des options dans une boîte de sélection (html) via JavaScript

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <script type="text/javascript"> 
      function updateTextBox() 
      { 
       var lstSource = document.getElementById("lstSource"); 
       var details = lstSource[lstSource.selectedIndex].text; 
       document.getElementById("txtDetails").value = details; 
      } 
     </script> 
    </head> 
    <body> 
     <select id="lstSource" onChange="updateTextBox();"> 
      <option value="26">My Text 

has a line break!</option> 
     </select> 
     <textarea id="txtDetails"></textarea> 
    </body> 

    </html>

Maintenant, lorsque je clique sur un élément dans ma boîte de sélection I » Si vous souhaitez que les sauts de ligne apparaissent dans la zone de texte, ils n'apparaissent tout simplement pas. J'ai vérifié dans le débogueur en remplissant le contrôle de sélection, et les sauts de ligne sont définitivement là (et ils apparaissent également dans l'info-bulle quand j'utilise la propriété "title" avec le même texte). Lorsque je débogue le code JavaScript et regarde les données réelles contenues dans les détails de la variable (en utilisant charCodeAt), alors je peux voir qu'il n'y a pas de saut de ligne, c'est à dire entre "Mon Texte" et "a un saut de ligne" est seulement un caractère espace (code 32).

Est-ce que quelqu'un a une idée si cela peut être corrigé, ou devrais-je vivre avec ce comportement buggé (à mon avis)? Peut-être que je manque quelque chose ...

Merci à l'avance

Source

2010-11-25 Gorgsenegger

HTML collapses whitespace, y compris les caractères de saut de ligne.

Vous pouvez utiliser les éléments <br> à la place, mais don't work à l'intérieur des éléments <option>. Donc, j'ai peur que ce que vous voulez réaliser ne soit pas possible avec HTML ...

Source

2010-11-25 12:47:22

Merci, au moins maintenant je sais :-) – Gorgsenegger

Lorsque HTML écrase des espaces, y compris des caractères de nouvelle ligne, vous devez créer un autre attribut dans la liste des options pour conserver votre texte avec des espaces blancs et retour à la ligne

exemple:

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <script type="text/javascript"> 
      function updateTextBox() 
      { 
       var lstSource = document.getElementById("lstSource"); 
       var details = lstSource[lstSource.selectedIndex].tmpText; 
       document.getElementById("txtDetails").value = details; 
      } 
      function onLoad() 
      { 
       var lstSource = document.getElementById("lstSource"); 
       var text = "Test +\n "; 
       for(var i=0;i<lstSource.options.length;i++) 
       { 
        lstSource.options[i].text = text +i; 
        lstSource.options[i].tmpText = text +i; 
       }     
      } 
     </script> 
    </head> 
    <body onload="onLoad()" > 
     <select id="lstSource" onChange="updateTextBox();"> 
      <option></option> 
      <option></option> 
      <option></option> 
      <option></option> 
      <option></option> 
      <option></option> 
     </select> 
     <textarea id="txtDetails" ></textarea> 
    </body> 

    </html>

Source

2010-11-25 14:08:05 Mouadh

sauts de ligne manquantes lors de l'accès des options dans une boîte de sélection (html) via JavaScript

Répondre

Questions connexes