笔下光年

select2下拉选择框

Select2 是一个优化下拉框 select 的 jQuery 插件,它支持搜索(搜索选择)、远程数据集、以及无限滚动的结果。这里集成的是4.0.10版本。

github地址:https://github.com/select2/select2

文档地址:https://select2.org/

需要增加以下的css。

  1. .select2-container {
  2. width: 100%!important;
  3. }

默认使用(引入相关的js和css后)

  1. <div class="form-group">
  2. <label for="example-select">你是一名</label>
  3. <select class="form-control js_select2" name="example-1" id="example-select">
  4. <option value>请选择</option>
  5. <option value="1">平面设计</option>
  6. <option value="2">程序员</option>
  7. <option value="3">前端工程师</option>
  8. <option value="4">产品经理</option>
  9. </select>
  10. </div>
  1. $('.js_select2').select2();

插件项目中页面名字:lyear_js_select2.html

演示地址:http://lyear.itshubao.com/v5/example/

涉及的文件:

  • js/select2/select2.min.css
  • js/select2/select2.min.js
  • js/select2/i18n/zh-CN.js