html的select下拉复选框,jquery sumoselect 插件实现 select下拉 复选框

jquery sumoselect  插件实现 select下拉 复选框,这是国外的大牛写的,参考网站如下:

http://hemantnegi.github.io/jquery.sumoselect/sumoselect_demo.html  官方demo网站

http://hemantnegi.github.io/jquery.sumoselect/  官网的方法使用说明.

1.只需要导入js和css,就可以直接在select上加一个,关键是multiple="multiple",就可以使用这个下拉复选框了,使用的方式如下:

$(document).ready(function () {

$('.SlectBox').SumoSelect({placeholder: 'This is a placeholder',csvDispCount: 3 });

});        运行结果为:

这些样式,还有更复杂的分组选择,如果要获取的选中的value值,我是自己写的遍历each选中的,然后用,逗号分割,传给后台的时候,再变成数组,如下代码:(在官网没有看到获取选中value的方法,有朋友知道可以告诉我):

//==========遍历多选===============

var positionRankSelectSpilt = "";

$("#positionRank option:selected").each(function(){

positionRankSelectSpilt += $(this).val()+ ",";

});

//职级的多选去掉最后一个逗号

positionRankSelectSpilt = positionRankSelectSpilt.substring(0,positionRankSelectSpilt.length -1);

alert("选中的:"+positionRankSelectSpilt);

//=====================================