Chosen 没有正确设置我的选择下拉菜单的样式答案

【问题标题】：Chosen is not styling my select drop-down properlyChosen 没有正确设置我的选择下拉菜单的样式
【发布时间】：2012-10-16 16:50:31
【问题描述】：

这是我的代码：

<link href="Content/chosen.css" rel="stylesheet" type="text/css"/>

<div>
<select id="chzn-select" data-placeholder="Select an option...">
    <option value=""></option>
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option>
</select>
</div>

<script type="text/javascript" src="../Scripts/jquery-1.8.2.js"></script>
<script type="text/javascript" src="../Scripts/chosen.jquery.js"></script>
<script type="text/javascript" src="../Scripts/chosen.jquery.min.js"></script>
<script type="text/javascript">

$("#chzn-select").chosen();

</script>

这是结果：

我可以“选择”选项 1 或选项 2，它们将出现在“选择一个选项...”标签所在的位置。

【问题讨论】：

您是否 100% 确定相对 url 是正确的？ href="Content/chosen.css" -- 也许应该是 href="/Content/chosen.css"
为什么要加载两次插件？
你能发个 jsfiddle 吗？
@xec，你是对的。这是与我的 css 网址有关的问题。

标签： javascript jquery css drop-down-menu jquery-chosen

【解决方案1】：

请尝试下面的代码，它对我有用。

<link href="http://harvesthq.github.com/chosen/chosen/chosen.css" rel="stylesheet" type="text/css"/>

<div>
 <select id="chzn-select" data-placeholder="Select an option...">
  <option value=""></option>
  <option value="Option1">Option 1</option>
  <option value="Option2">Option 2</option>
 </select>
</div>

<script type="text/javascript">
    $("#chzn-select").chosen();
</script>

这是JSFIddle（代码的工作演示）

chosen.jquery.js 在您的代码中包含了两次。另外我认为 chosse.css 路径需要根据您的目录结构在您的代码中更正。

【讨论】：