Jquery统一改变选择大小

Question

如何使用 Jquery Uniform 更改输入选择的大小？

http://uniformjs.com

Answer 1

<script>
 $('div.selector span', $('#parent_span')).css('width', '600px');
 $('div.selector', $('#parent_span')).css('width', '630px');
</script>

<span id="parent_span">
 <select style="width:630px;">
 </select>
</span>

Answer 2

使用 CSS 更改 div.selector span 的宽度，但您还必须考虑父标记的宽度。

Answer 3

这对我有用：

创建时设置 selectAutoWidth : true 。

例如：

$("select, input, textarea, input:checkbox, input:radio, input:file").uniform({selectAutoWidth : true});

然后给选择一个宽度。例如：

Answer 4

使用内联样式是不好的做法。根据 Uniform 文档，这是正确的方法：

如果您想指定选择元素的大小，然后让 Uniform 适当地包装它，则会有一些困难。需要检测元素的大小，然后通过 Uniform 更改元素的大小。为此，建议您在遇到问题时执行以下解决方案之一。

• 为元素设置自定义内联宽度 ()（不好的做法）

  或者

• 使用两个 css 规则；选择 { width: XXpx } 和 .selector select { width: 100% }

因此，使用第二个选项，在你的 css 文件中执行以下操作：

#parent_span select {width:630px;)
#parent_span .selector select {width:100%;}

技巧是 630px 用于构建包装 Uniform div，然后启动第二个 css 规则，其中使 select 标签在其中占据 100%。