Chosen.js的输入字段类型为文本,其样式为选择框?

时间:2017-01-27 05:37:02

标签: jquery jquery-chosen

我想将chosen.js应用于输入字段。这是我的代码

<label>
   <input type="text"/>
   <div class="custom-placeholder">
      <span>Placeholder text</span>
   </div>
   <div><img src="dropdown icon.img"/></div>
</label>

上面的代码输出正好出现一个选择框(我通过我的项目设置了样式)。现在,我想将它用作selected.js选择框。请帮我。如果我使用而不是上面的代码,我需要更改很多样式

1 个答案:

答案 0 :(得分:0)

试试此链接:https://jsfiddle.net/esedic/Da4m3/

<强>更新

请在页面上附上以下链接:

https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.css

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css

https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.jquery.min.js

    <select id="first" data-placeholder="Choose a Country..." class="chosen-select" multiple style="width:350px;" tabindex="4">
              <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> 
              <option value="Algeria">Algeria</option> 
              <option value="American Samoa">American Samoa</option> 
              <option value="Andorra">Andorra</option> 
              <option value="Angola">Angola</option> 
              <option value="Anguilla">Anguilla</option> 
            </select>
<script>
$(function()
{
  $(".chosen-select").chosen();
})
</script>

如果您想一次只选择一个项目,请删除属性多个