<select><option> padding/spacing 问题

~Zero

我要的效果是这样.

我试过:

1. <select>
   
2. <option style="padding-left: 0px;">Option Level 1</option>
   
3. <option style="padding-left: 5px;">Option Level 2</option>
   
4. <option style="padding-left: 10px;">Option Level 3</option>
   
5. </select>

复制代码

这个的效果在 firefox 可行, 可是 IE, chrome, opera 都不行.

我试过:

1. <select>
   
2. <option>Option Level 1</option>
   
3. <option> &nbsp;&nbsp;Option Level 2</option>
   
4. <option> &nbsp;&nbsp;&nbsp;&nbsp;Option Level 3</option>

复制代码

这样的话, 在 selected 的时候也会有 space.

看起来最理想的我试过是:

1. <select>
   
2. <opgroup label="Option Level 1">
   
3. <opgroup label="Option Level 2">
   
4. <option>Option Level 3</option>
   
5. </optgroup>
   
6. </optgroup>
   
7. </select>

复制代码

可是, 我要的效果是, Level 1 和 2 都可以选的.

怎么办? 有什么简单的好方法?
(另外 code 一个 javascript 好像太小题大作了.)

Super-Tomato

我要的效果是这样.

我试过:这个的效果在 firefox 可行, 可是 IE, chrome, opera 都不行.

我试过:这 ...
~Zero 发表于 2010-9-6 10:06 AM

简单的話使用  ＆#160; 代替空格


p/s: 如果要多样化我想還是須配合 css 与 javascript

pshlim

"
我试过: <select>
<option>Option Level 1</option>
<option> nbsp;&nbsp;Option Level 2</option>
<option> nbsp;&nbsp;&nbsp;&nbsp;Option Level 3</option>
复制代码这样的话, 在 selected 的时候也会有 space.
"

那就在option 里加value 咯。。。

~Zero

不是 value 问题, 是如果加 space 的话, 那比如说第二个 option 有两个 space,
在 drop down 里面选择第二个 option 的时候, 在 menu 里面也会有两个 space, 很不美观.

Super-Tomato

不是 value 问题, 是如果加 space 的话, 那比如说第二个 option 有两个 space,
在 drop down 里面选择第二 ...
~Zero 发表于 2010-9-29 11:42 PM

自己去掉不必要的空格就好了啊， 演示

宅男-兜着走

自己去掉不必要的空格就好了啊，
Super-Tomato 发表于 2010-9-30 12:14 AM

1. 
   
2.    document.getElementById("selector").innerHTML = "Select : " + str.replace(/(^\s*)|(\s*$)/g, "");
   
3.    

复制代码

感谢， 但是这句看不懂。 str.replace(/(^\s*)|(\s*$)/g, "");

Super-Tomato

感谢， 但是这句看不懂。 str.replace(/(^\s*)|(\s*$)/g, "");
宅男-兜着走 发表于 2010-9-30 01:31 AM

使用 regular expression 把開始或结尾的空格替换

~Zero

Super-Tomato

~Zero 发表于 2010-9-30 04:54 PM

自己變通一下就可以達到你所要的效果了啊  演示

~Zero

回复 9# Super-Tomato
瓦～ 很好，这就是我要的！！！
谢谢你～ 每次在论坛帮到最多的就是你了呵呵，超级感激的。
^^