2009-01-08 4 views
9

Je voudrais ajouter une option < élément > à un élément de sélection < > où le texte de l'élément d'option < > contient une entité HTML: & mdash;Comment créer dynamiquement un <option> en JavaScript contenant une entité HTML (- ... «)?

En HTML, le code ressemblerait à ceci:

<select name="test" id="test"> 
    <option value="">&mdash; Select One &mdash;</option> 
</select> 

Code Mon JavaScript ressemble à ceci:

function selectOne() { 
    var e = document.getElementById('test'); 
    e.options[0] = new Option('&mdash; Select One &mdash;', ''); 
} 

Cependant, comme vous le verrez si vous testez cela, le & mdash; devient échappé. J'ai eu le même résultat quand j'ai essayé:

e.options[o].text = '&mdash; Select One &mdash;'; 

(comportement a été observé: dans Internet Explorer 7   ... n'a pas testé avec Firefox, Safari, etc. - Internet Explorer 7   est le seul navigateur dont j'ai besoin . au moment)

+0

Y a-t-il une raison pour laquelle "-" doit être échappé? –

+0

Je ne connaissais pas d'autre moyen d'ajouter (facilement) un mdash. Si c'était un simple n-dash ... j'utiliserais simplement la touche dash/minus du clavier. Je suppose que j'aurais dû utiliser l'exemple de "peut-être". –

Répondre

16

Je viens de réaliser que je pouvais utiliser JavaScript escape Unicode:

e.options[0] = new Option('\u2014 Select One \u2014', ''); 
+0

Cette solution et la solution de Chetan fonctionnent toutes deux. Cela dépend du style que vous préférez. Pour moi, je préfère définir la valeur une fois au lieu de revenir en arrière et de la changer ensuite comme dans la solution de Chetan. –

6

Vous n'avez pas besoin d'échapper à l'entité - il fonctionne comme ceci:

function selectOne() { 
     var e = document.getElementById('test'); 
     e.options[0] = new Option('— Select One —', ''); 
} 
+0

True - mais je pensais à N'IMPORTE QUELLE entité HTML ... comme un « –

+0

Cela fonctionne pour toute entité HTML, même si elle peut rencontrer des problèmes d'encodage. Vos séquences d'échappement Unicode sont probablement la solution la plus portable. –

1

text La propriété n'est pas dégagée, car elle est censée être prise littéralement. Si vous utilisez innerHTML, les entités sont converties en caractères correspondants.

e.options[o].innerHTML = '&mdash; Select One &mdash;'; 
Questions connexes