//表单声明元素
< input type="text" id="selectPage" class="input-block-level" >
//定义数组,在服务端返回的数据也以该格式返回:Array[{Object},{...}]
var tag_data = [
    {id:1 ,name:'Chicago Bulls',desc:'芝加哥公牛'},
    {id:2 ,name:'Cleveland Cavaliers',desc:'克里夫兰骑士'},
    {id:3 ,name:'Detroit Pistons',desc:'底特律活塞'},
    {id:4 ,name:'Indiana Pacers',desc:'印第安纳步行者'}
];
//showField:设置下拉列表中显示文本的列
//keyField:设置下拉列表项目中项目的KEY值,用于提交表单
//data:数据源,可以是JSON数据格式,也可以是URL
//callback:选中项目后的回调函数
$('#selectPage').bSelectPage({
    showField : 'desc',
    keyField : 'id',
    data : tag_data
});
		
//data-init:设置列表初始被选中的项目,传递值为keyField对应的内容
< input type="text" id="selectPage1" data-init="4" >
$('#selectPage').bSelectPage({
    showField : 'desc',
    keyField : 'id',
    data : '/sys/userinfo',
    params : function(){return {'name':'aa','sex':1};}
});
		
< input type="text" id="selectPage" class="input-xlarge" >
$('#selectPage').bSelectPage({
    showField : 'desc',
    keyField : 'id',
    data : tag_data,
    //格式化显示项目,提供源数据进行使用
    formatItem : function(data){
        return data.desc + '(' + data.name + ')';
    }
});
		
< input type="text" id="selectPage" class="input-block-level" >
$('#selectPage').bSelectPage({
    showField : 'desc',
    keyField : 'id',
    data : tag_data,
    //启用多选模式
    multiple : true
});
		
< input type="text" id="selectPage" class="input-block-level" >
$('#selectPage').bSelectPage({
    showField : 'desc',
    keyField : 'id',
    data : tag_data,
    multiple : true,
    //选中项目后的回调处理
    //入参:data:选中行的原始数据对象
    callback : function(data){
        $('#callbackLog').append(data.desc + '(' + data.name + ')
');
    }
});