javascript - 如何放置边框 : 1px solid #ddd around a selectbox using jQuery?

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'
});