jquery - 自定义样式的选择框变得不可点击

Question

我正在使用这个 jQuery 插件来设置选择框的样式，但是当样式应用时，选择框现在变得不可点击...

这是一个示例，如果您向下滚动“县”字段并尝试单击它，则没有...

任何想法都会很棒。

Answer 1

请参阅以下内容：

HTML

<select name="country">
    <option>country 1</option>
    <option>country 2</option>
</select>

Answer 2

你的select元素是空的吗？您是否正确设置了元素的样式？如果您没有指定任何样式，下拉列表将看起来像一个干净的文本元素（span,p等）。customSelect 插件没有默认的 CSS 样式。

尝试删除此DEMO中的 CSS 。

截屏

---

即使您的文件链接似乎没有任何问题，请尝试将 jQuery 链接和 costomSelect 链接放在您的head标签中。

HTML

<select id="county">
    <option value="test">
        a
    </option>
</select>

jQuery/JavaScript

$('#county').customSelect();

CSS

.customSelect {
  background-color: white;
  padding: 6px 10px;
  border: 4px solid #b7bfcf;
  background: url(http://adam.co/lab/jquery/customselect/images/select-box-bg.gif) right center;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
    min-width:100px;
}
.customSelectHover {
  border-color: #aeb7c9;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 2px;
  -moz-box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 2px;
  box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 2px;
}