Question

我需要你的帮助，

很多网站都在使用jQuery框架来设计他们的选择框样式。据我们所知，我在工作中使用ie7时遇到困难，我想在我的选择框周围添加一个1px的固体#ddd边框（这必须与ie7兼容）。我知道ie7本身不支持css。

如何使用jQuery设计我的选择框以实现此目的？

<select>
    <option value="">Month</option>
    <option value="january">January</option>
    <option value="february">February</option>
    <option value="march">March</option>
    <option value="april">April</option>
    <option value="may">May</option>
    <option value="june">June</option>
    <option value="july">July</option>
    <option value="august">August</option>
    <option value="september">September</option>
    <option value="october">October</option>
    <option value="november">November</option>
    <option value="december">December</option>
</select>

如果还有一种快速的轻量级方式，也可以将下拉边框的样式设置为与选择框中边框相同的颜色，这样也很棒。

感谢。

Answer 1

使用jQuery-Selectbox插件。您可以将普通的<select>元素转换为漂亮的HTML样式。

链接到JS文件：

<script src="jquery.selectbox.min.js" type="text/javascript"></script>

添加CSS文件（或将内容附加到您自己的样式表）：

<link href="jquery.selectbox.css" rel="stylesheet" type="text/css" />

初始化：

// default
$('select').selectBox();

// or with custom settings
$('select').selectBox({
    mobile: true,
    menuSpeed: 'fast'
});

Answer 2

您可以使用here中的jQuery-UI Selectable插件。

如果您希望设置默认<select>的样式，我认为Link 1和 Link 2任何人都能得到多远。

您可能还想查看SO上的this问题。

如何使用jQuery围绕选择框放置边框：1px solid #ddd？

2 个答案: