无法理解选择插件无效的原因

Question

我正在使用RubyOnRails,所以我的所有样式表都应该自动包含.

我想让我的下拉列表更加用户友好,我选择了Chsen插件.

这是我的页面代码:

<link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/chosen.css?body=1" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/chosen.jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/chosen.jquery.min.js?body=1" type="text/javascript"></script>
<script src="/assets/static_pages.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>

所以包括javascripts和样式表,是吗？

我的HTML代码(来自exmple):

       <select tabindex="1" style="width:350px;" data-placeholder="Choose a Country">
            <option value=""></option> 
            <option value="United States">United States</option> 
            <option value="United Kingdom">United Kingdom</option> 
            <option value="Afghanistan">Afghanistan</option> 
            <option value="Albania">Albania</option>                
          </select>

在我的application.js文件中:

  $(document).ready(function(){
  $(".chzn-select").chosen();
  });

在Google控制台中没有错误,但在我的页面中它显示为默认选择列表.为什么？

Answer 1

您需要在select标签中添加"chzn-select"类.您的js代码将所选插件应用于它找到的使用该类的任何元素.以下是您的选择标记应如下所示:

<select class="chzn-select" tabindex="1" style="width:350px;" data-placeholder="Choose a Country">
    <option value=""></option> 
    <option value="United States">United States</option> 
    <option value="United Kingdom">United Kingdom</option> 
    <option value="Afghanistan">Afghanistan</option> 
    <option value="Albania">Albania</option>                
</select>