Comment mettre un espace avant le texte d'une option dans un élément de sélection HTML ?

StackOverflow https://stackoverflow.com/questions/25752

  •  09-06-2019
  •  | 
  •  

Question

Dans une liste déroulante, je dois ajouter des espaces devant les options de la liste.j'essaie

<select>
<option>&#32;&#32;Sample</option>
</select>

pour ajouter deux espaces mais il n'affiche aucun espace.Comment puis-je ajouter des espaces avant les textes d'options ?

Était-ce utile?

La solution

N'est-ce pas &#160 l'entité pour l'espace ?

<select>
<option>&#160;option 1</option>
<option>    option 2</option>
</select>

Travaille pour moi...

MODIFIER:

Je viens de vérifier ça, là peut Il y a des problèmes de compatibilité avec cela dans les anciens navigateurs, mais tout semble bien fonctionner pour moi ici.Je pensais juste que je devrais vous le faire savoir, car vous souhaiterez peut-être remplacer par &nbsp;

Autres conseils

je pense que tu veux &nbsp; ou &#160;

Une version corrigée de votre exemple pourrait donc être...

<select>
  <option>&nbsp;&nbsp;Sample</option>
</select>

ou

<select>
  <option>&#160;&#160;Sample</option>
</select>

Utiliser \xA0 avec Chaîne.Cela fonctionne parfaitement lors de la liaison des données du modèle C# à une liste déroulante...

  SectionsList.ForEach(p => { p.Text = "\xA0\xA0Section: " + p.Text; });

Comme Rob Cooper l'a souligné, il existe des problèmes de compatibilité avec les anciens navigateurs (IE6 affichera les lettres "& nbsp;"

C'est ainsi que je contourne ce problème dans ASP.Net (je n'ai pas VS ouvert donc je ne suis pas sûr de savoir à quels caractères cela est réellement traduit) :

Server.HtmlDecode("&nbsp;")

j'ai essayé plusieurs choses mais la seule chose qui a fonctionné pour moi était d'utiliser javascript.remarquez simplement que j'utilise le code Unicode pour l'espace plutôt que l'entité HTML, car js ne connaît rien aux entités

$("#project_product_parent_id option").each(function(i,option){
  $option = $(option);
  $option.text($option.text().replace(/─/g,'\u00A0\u00A0\u00A0'))
});

Vous pouvez également appuyer sur alt+espace (sur mac) pour un espace insécable.Je l'utilise pour un module Drupal car Drupal décode les entités HTML.

Je suis presque certain que vous pouvez également y parvenir avec le remplissage CSS.Alors vous ne serez pas marié aux caractères spatiaux codés en dur dans tous vos <option> Mots clés.

@Brian

Je suis presque certain que vous pouvez également y parvenir avec le remplissage CSS.Ensuite, vous ne serez pas marié aux caractères d'espace codés en dur dans toutes vos balises.

Bonne réflexion - mais malheureusement, cela ne fonctionne pas dans (le navigateur préféré de tout le monde...) IE7 :-(

Voici du code qui fonctionnera dans Firefox (et je suppose qu'Op/Saf).

<select>
    <option style="padding-left: 0px;">Blah</option>
        <option style="padding-left: 5px;">Blah</option>
            <option style="padding-left: 10px;">Blah</option>
    <option style="padding-left: 0px;">Blah</option>
        <option style="padding-left: 5px;">Blah</option>
</select>

Utilisez simplement le caractère 255 (tapez Alt+2+5+5 sur votre pavé numérique) avec une police à espacement fixe comme Courier New.

Server.HtmlDecode("&nbsp;") est le seul qui a fonctionné pour moi.

Sinon, les chr sont imprimés sous forme de texte.

J'ai essayé d'ajouter le remplissage en tant qu'attribut pour l'élément de liste, mais cela ne l'a pas affecté.

&nbsp;

Pouvez-vous essayer ça ?Ou est-ce le même?

J'avais également le même problème et je devais le résoudre le plus rapidement possible.Même si j'ai beaucoup cherché sur Google, je n'ai pas réussi à trouver une solution rapide.

Au lieu de cela, j'ai utilisé ma propre solution, même si je ne suis pas sûr qu'elle soit appropriée, elle fonctionne dans mon cas et c'est exactement ce que je devais faire.

Ainsi, lorsque vous ajoutez un ListItem dans la liste déroulante et que vous souhaitez ajouter de l'espace, utilisez ce qui suit : -

Presse ALT et tapez 0160 sur votre clavier numérique, cela devrait donc ressembler à quelque chose comme ALT+0160.Cela ajoutera un espace.

ListItem("ALT+0160 ALT+0160 TEST", "TESTVAL")

J'ai essayé plusieurs de ces exemples, mais la seule chose qui a fonctionné a été d'utiliser du javascript, un peu comme celui de Dabobert, mais pas de jQuery, tout simplement du vieux javascript vanille et des espaces :

for(var x = 0; x < dd.options.length; x++)
{
    item = dd.options[x];
    //if a line that needs indenting
    item.text = '     ' + item.text; //indent
}

Il s'agit uniquement d'IE.IE11 en fait.Pouah.

1.Articles retournés à la liste

2.Boucle Foreach dans la liste

3..

foreach (var item in q)
{
    StringWriter myWriter = new StringWriter();

    myWriter.Lable = HttpUtility.HtmlDecode(item.Label.Replace(" ", "&nbsp;"));
}

Cela fonctionne pour moi !!!

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top