如何在HTML select元素的选项文本之前放置空格字符?

如何在HTML select元素的选项文本之前放置空格字符?

How do I put a space character before option text in a HTML select element?

在下拉列表中,我需要在列表中的选项之前添加空格。 我在尝试

1
2
3
<select>
<option>Sample</option>
</select>

用于添加两个空格,但不显示空格。 如何在选项文本之前添加空格?


不是 /code> the entity for space?

Works for me...

EDIT:

Just checked this out, there may be compatibility issues with this in older browsers, but all seems to work fine for me here. Just thought I should let you know as you may want to replace with


将\ xA0与String一起使用。
将C#模型数据绑定到下拉菜单时,此方法非常完美。

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

我认为您想要

因此,您的示例的固定版本可能是...

1
2
3
<select>
  <option>Sample</option>
</select>

要么

1
2
3
<select>
  <option>Sample</option>
</select>

正如Rob Cooper指出的那样,旧版浏览器存在一些兼容性问题(IE6将显示实际字母"&nbsp;"

这就是我在ASP.Net中解决该问题的方式(我没有打开VS,所以我不确定将其实际转换为哪些字符):

1
Server.HtmlDecode("")

我尝试了多种方法,但对我而言唯一有效的方法是使用javascript。只是注意到我使用的是unicode代码而不是html实体,所以js确实对实体有所了解

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

您也可以按alt + space键(在Mac上为不间断空格)。我将它用于Drupal模块,因为Drupal会解码html实体。


@布莱恩

I'm nearly certain you can accomplish this with CSS padding, as well. Then you won't be married to the space characters being hard-coded into all of your tags.

很好的想法-但不幸的是,它在(每个人最喜欢的浏览器...)IE7中均不起作用:-(

这是一些可以在Firefox中运行的代码(我假设是Op / Saf)。

1
2
3
4
5
6
7
<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>

我几乎可以肯定,您也可以使用CSS填充来完成此操作。这样,您就不必再将空格字符硬编码到所有标签中了。


只需使用带有Courier New之类的等宽字体的char 255(在数字小键盘上键入Alt + 2 + 5 + 5)即可。


我也遇到了同样的问题,必须尽快解决。尽管我搜索很多,但找不到快速解决方案。

取而代之的是,我使用了自己的解决方案,尽管我不确定该解决方案是否合适,它是否适合我的情况以及需要执行的操作。

因此,当您在下拉列表中添加ListItem并想要添加空间时,请使用以下命令:

ALT并在数字小键盘上键入0160,所以它应该类似于ALT+0160。它将添加一个空间。

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

Server.HtmlDecode("")是唯一为我工作的人。

否则,chr将作为文本打印。

我尝试将填充添加为listitem的属性,但是并没有影响它。


1
 

你可以试试看吗?还是一样?


在PHP中,您可以使用html_entity_decode:

1
2
obj_dat.options[0] = new Option('Menu 1', 'Menu 1');
obj_dat.options[1] = new Option('<?php echo html_entity_decode(''); ?>Menu 1.1', 'Menu 1.1');

1.物品返回清单

2.Foreach循环列表

3 ..

1
2
3
4
5
6
foreach (var item in q)
{
    StringWriter myWriter = new StringWriter();

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

这项工作对我来说!!!


我尝试了其中几个示例,但是唯一有效的方法是使用javascript,就像dabobert的一样,但不是jQuery,只是普通的旧式javascript和空格:

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

这仅是IE。 IE11实际上。啊。


推荐阅读