bootstrap-select怎么用

基本用法

用 .selectpicker class 创建<select>

<select class="selectpicker">

<option>Mustard</option>

<option>Ketchup</option>

<option>Relish</option>

</select>

启用 Bootstrap-Select via JavaScript:

$('.selectpicker').selectpicker()

设置：

$('.selectpicker').selectpicker({

style: 'btn-info',

size: 4

})

bootstrap-select实现下拉框多选效果

HTML代码：

<div class= "row" style ="margin-top :10px">

<div class= "form-group col-xs-12">

<label for= "sceneModel_title" class="col-sm-1 col-sm-offset-1 control-label" >分类: </label>

<div class= "col-sm-4">

<select class= "form-control selectpicker" multiple>

<option>请选择</option >

<option>游记</option >

<option>景点</option >

<option>东京</option >

<option>日本</option >

<option>香港</option >

<option>加拿大</option >

</select>

</div>

<label for= "scene_title" class="col-sm-1 control-label" >主题游: </label>

<div class= "col-sm-4">

<select class= "form-control selectpicker" multiple>

<option>请选择</option >

<option>游船</option >

<option>漂流避暑</option >

<option>博物馆</option >

<option>影视基地</option >

<option>名胜古迹</option >

<option>海岛度假</option >

</select>

</div>

<!-- <div class="col-sm-10">-->

<%-- <form:checkboxes path="sceneTypeRelations" items="${sceneTypeMap}" />--%>

<!-- </div>-->

</div>

</div>

js代码：

define(function(require, exports, module) {

var $ = require( "jquery")

require( "jquery-validation/1.11.1/jquery.validate.min.js" )

require( "jquery-validation/1.11.1/messages_bs_zh.js" )

require( "bootstrap/select/bootstrap-select.min.css" )

require( "bootstrap/select/bootstrap-select.min.js" )

$(document).ready( function() {

// 聚焦第一个输入框

$( "input[name=name]").focus()

// 为inputForm注册validate函数

$( "#sceneModel").validate()

var lon = $("input[name=longitude]" ).val()

if (lon == "," ) {

$( "input[name=longitude]").val("" )

}

jQuery( '.selectpicker').selectpicker({

liveSearch: true,

size:8

})

})

module.exports = $

})