1.下载地址
https://github.com/davidstutz/bootstrap-multiselect
2.文档地址:
http://davidstutz.github.io/bootstrap-multiselect/#known-issues
3.使用方法如下:
<!-- Build your select: --> <select id="test" class="multiselect" multiple="multiple"> <option value="1">Cheese</option> <option value="2">Tomatoes</option> <option value="3">Mozzarella</option> <option value="4">Mushrooms</option> <option value="5">Pepperoni</option> <option value="6">Onions</option> </select> <script type="text/javascript"> $(document).ready(function() { $('#test').multiselect(); }); </script>
4.可以给选择框设置一些参数
nonSelectedText: '请选择',
allSelectedText: '全部',
includeSelectAllOption: true,
selectAllText: '全部'
5.得到值
$('#test').val()
6.得到name,暂时没发现方法,自己写了下。
buttonTitle: function(options, select) { var selected = ''; options.each(function () { selected += $(this).text() + ', '; }); $('#test_name').val(selected.substr(0, selected.length - 2)); return selected.substr(0, selected.length - 2); }
7.低版本的jquery会导致id不能正确获取的问题,可以用上面获取name的办法得到id.添加一个隐藏域,将id赋值给隐藏域,不要直接给选择框的id赋值,会出现问题
相关推荐
在网页开发中,多选下拉框是一种常见的交互元素,用户可以从中选择多个选项。JavaScript(简称js)作为客户端脚本语言,常被用来增强网页的交互性,其中包括实现多选下拉框的功能。本文将深入探讨如何使用JavaScript...
要实现多选下拉框功能,我们需要自定义组件或者使用第三方库来扩展`JComboBox`的功能。 ### 一、自定义多选下拉框 自定义多选下拉框通常涉及以下几个关键步骤: 1. **创建自定义模型**:你需要创建一个自定义的`...
Layui是一个强大的前端UI框架,它提供了一系列美观且易于使用的组件,包括我们所讨论的多选下拉框。"layui-select-multiple"就是Layui专门为多选下拉框设计的一整套样式和功能。 首先,我们来看“layui多选下拉框...
《jQuery实现的多选下拉框深度解析》 在网页开发中,为了提供更好的用户体验,我们经常需要使用到多选下拉框。jQuery库为我们提供了丰富的功能,使得创建交互式的多选下拉框变得轻而易举。在这里,我们将深入探讨...
本文将深入探讨如何创建一个自定义的多选下拉框控件,以提升用户体验,并利用Ajax技术实现异步更新,提高页面的响应速度。 一、多选下拉框控件的理解 多选下拉框控件是一种允许用户从一系列选项中选择多个值的UI...
1. **多选下拉框基础**: - 在HTML中,`<select>`元素通常用于创建单选的下拉列表,通过设置`<select>`的`multiple`属性,可以使其变为多选模式。例如: ```html <option>Option 1 <option>Option 2 ... `...
JS多选下拉框,实现多选。点击显示下拉。 <!-- function $(e){return document.getElementById(e) ;} $('btnSelect').onclick = function () { //§ó§ï?? $('status').innerHTML = $('status').innerHTML=...
多选下拉框的基本结构通常包括一个隐藏的`<select>`元素和一组可见的`<label>`与`<input type="checkbox">`。每个`<label>`包裹一个`<input>`,并与其关联一个`<option>`,通过`for`属性链接`<input>`与`<option>`...
在Bootstrap中实现多选下拉框可以极大提升用户体验,使得用户在有限的空间内可以选择多个选项。以下是如何使用Bootstrap来创建这样一个功能的详细步骤。 首先,确保你已经在你的项目中引入了Bootstrap的相关资源。...
**基于jQuery实现的多选下拉框** 在Web开发中,传统的HTML下拉框(`<select>`元素)通常只支持单选,但有时我们可能需要一个可多选的下拉框来提供用户更多的选择灵活性。这篇教程将详细介绍如何利用jQuery库来创建...
"带checkbox的多选下拉框"是一种常见的需求,它允许用户在下拉菜单中通过勾选复选框来选择多个选项。本知识点主要探讨如何在C#中实现这种控件,并将它应用到实际项目中。 首先,我们需要了解基本的Windows Forms...
【PB多选下拉框】是一种在PowerBuilder(PB)应用程序中实现的用户界面组件,它允许用户在下拉菜单中选择多个选项。PB90指的是PowerBuilder 9.0版本,这是一款由Sybase公司(现已被SAP收购)开发的可视化编程工具,...
EXT3.2 多选下拉框是一种在EXT JS框架中实现的用户界面组件,它允许用户在下拉菜单中选择多个选项。EXT JS是一个基于JavaScript的富客户端应用开发框架,用于构建桌面级的Web应用。EXT3.2是EXT JS的一个版本,尽管...
以上就是实现一个WinForm的多选下拉框控件的基本步骤。通过这样的自定义控件,我们可以更灵活地满足用户在界面上的选择需求,同时保持了标准控件的易用性和兼容性。在实际项目中,还可以根据具体需求进行进一步的...
为了提供一个统一且可自定义样式的多选下拉框,我们可以借助jQuery和其他辅助库,如Bootstrap的Selectpicker或者Chosen插件。这些工具允许我们创建更现代、更易用的多选下拉组件。 1. **jQuery基础**:jQuery是一个...
《layui-多选下拉框-xm-select:前端开发中的高效解决方案》 在现代Web开发中,用户界面的交互性和易用性是至关重要的。layui框架以其轻量级、高效和丰富的组件库,成为了众多开发者青睐的选择。尤其在构建多选...
在Swing中,多选下拉框通常由JComboBox类实现,但默认的JComboBox只支持单选。为了实现多选功能,我们需要扩展JComboBox或者使用第三方库,如JList或JTable与弹出面板组合。 本主题涉及的知识点主要包括以下几个...
在网页开发中,多选下拉框是一种常见的用户交互元素,允许用户在多个选项中进行复选选择。这里我们将深入探讨“bootstrapSelect”和“EasyUI”这两种流行的前端框架实现多选下拉框的方法,以及它们所依赖的文件。 ...
**jQuery多选下拉框插件详解** 在Web开发中,多选下拉框是一种常见的交互元素,它允许用户在一组选项中选择多个值。jQuery作为最流行的JavaScript库之一,提供了许多插件来增强这种用户体验。`jquery.multi-select....
在网页开发中,jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件...以上就是利用 jQuery 创建可多选下拉框的基本步骤和相关技术点,通过这种方式,你可以创建一个易于使用且具有交互性的多选下拉框。