jQuery MultiSelect 如何设置多选框的默认选中项

原创 2016年05月31日 19:55:14
<script src="../js/jquery-1.3.2.js" type="text/javascript"></script>
<script src="../js/jquery.multiSelect.js" type="text/javascript"></script>
<link href="css/jquery.multiSelect.css" rel="stylesheet" type="text/css" />
我用的是jQuery MultiSelect 插件下拉多选框,
Select:
        <select id="control_7" name="control_7[]" multiple="multiple" size="5">
            <option value="">请选择</option>
            <option value="1">性病商务通</option>
            <option value="2">商务通</option>
            <option value="3">QQ</option>
            <option value="4">性病QQ</option>
            <option value="5">企业QQ</option>
            <option value="6">电话</option>
            <option value="7">性病电话</option>
            <option value="8">微信</option>
            <option value="9">竞D1</option>
            <option value="10">竞D2</option>
            <option value="11">竞D3</option>
            <option value="12">竞D4</option>
            <option value="13">400电话</option>
            <option value="14">挂号网</option>
        </select>
jQuery MultiSelect 插件:

.......................

if(jQuery) (function($){

//渲染HTML的一个单一的选项
function renderOption(id, option)
{
var html='<label><input type="checkbox" name="' + id + '[]" value="' + option.value + '"';
if( option.selected ){
html+='checked="checked"';
}
html += ' />' + option.text + '</label>';
return html;
}

// 渲染选项/的HTML optgroups
function renderOptions(id, options, o)
{
var html = "";
for(var i = 0; i < options.length; i++) {
if(options[i].optgroup) {
html += '<label class="optGroup">';
if(o.optGroupSelectable) {
html += '<input type="checkbox" class="optGroup"/>' + options[i].optgroup;

}
else {
html += options[i].optgroup;
}

html += '</label><div class="optGroupContainer">';
html += renderOptions(id, options[i].options, o);
html += '</div>';
}
else {
html += renderOption(id, options[i]);
}
}
return html;
}





我提交的时候都变没了,就一个了,我想要的是我选中几个默认选中就是几个。



在调用这个插件前用jquery设置optin的selected属性

JavaScript code
?
1
2
3
4
5
6
7
var v='1,2,3'//这个为保存的值,自己从数据库读取来赋值给v变量
v=','+v+',';//添加分隔符号,好indexOf进行比较
var arr=v.split(',');
$('#control_7 option').each(function(){
  if(v.indexOf(','+this.value+',')!=-1)this.selected=true;
});
//再调用插件初始化select对象

版权声明:本文欢迎转载!

下拉框多选实现 jquery-multiselect 并获取选中的值

首选引入js文件 Option 1 Option 2 Option 3 Option 4 Option 5 Option 6 Option 7 下拉列表 ...
  • duan9421
  • duan9421
  • 2015年04月20日 14:15
  • 11288

多选下拉控件multiselect使用小结

项目开发中,需要用到多选下拉列表插件,由于项目前端框架采用了bootstrap,因此自然选择了bootstrap的组件。经了解其有两组插件: 1、第一个组件是写bootstrap table的主人公 ...
  • nihaoma71121
  • nihaoma71121
  • 2016年03月24日 16:30
  • 47985

jQuery multiselect初始化及默认值修改

jsp                                                         0}">                           ...
  • tucailing
  • tucailing
  • 2014年05月22日 15:54
  • 6951

bootstrap-multiselect.js多选下拉框初始化时默认选中初始值

bootstrap-multiselect.js多选下拉框初始化时默认选中初始值
  • SuperCookies
  • SuperCookies
  • 2017年11月01日 11:43
  • 1467

jQuery multiselect初始化及默认值修改

js部分: $(document).ready(function(){ $("#sceneIdSelectBox").multiselect({ multiple: tru...
  • liu4071325
  • liu4071325
  • 2017年01月12日 11:31
  • 3432

<select> 标签的 multiple 属性规定可同时选择多个选项。

1.使用multiple属性可以实现多选 multiple="multiple" size="2"> Volvo Saab Opel Audi 2.     pageEncoding="G...
  • gtlishujie
  • gtlishujie
  • 2016年08月19日 14:09
  • 4334

select实现多选、全选、全不选

今天使用select下拉框实现了全选,全不选和多选的功能,效果如图: 1、html代码:为select标签设置multiple属性为true java javaSE ...
  • cat_pp
  • cat_pp
  • 2017年03月08日 15:54
  • 9565

Bootstrap Multiselect中文api

Demo: http://davidstutz.github.io/bootstrap-multiselect/ 代码: https://github.com/ehynds/jquery...
  • fangzilixia
  • fangzilixia
  • 2016年04月27日 22:57
  • 19402

bootstrap-multiselect样式修改

问题bootstrap-multiselect是一款相当不错的bootstrap风格下拉框组件,但是它的某些样式我不是很喜欢,按钮文本和下拉符号 “” 都是居中的,且下拉列表的宽度也没有跟随变动。 ...
  • u012143455
  • u012143455
  • 2017年04月13日 15:36
  • 3862

jquery下拉选择插件multiselect

  • 2014年07月10日 10:27
  • 63KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jQuery MultiSelect 如何设置多选框的默认选中项
举报原因:
原因补充:

(最多只允许输入30个字)