方法:获取多选下拉框对象数组→循环判断option选项的selected属性(true为选中,false为未选中)→使用value属性取出选中项的值。实例演示如下:

1、HTML结构

1
2
3
4
5
6
7
<select id="test" multiple="true">
    <option value="option-A">option-A</option>  
    <option value="option-B">option-B</option>
    <option value="option-C">option-C</option
    <option value="option-D">option-D</option>
</select>
<input type="button" value="确定" onclick="fun()" />

2、javascript代码

1
2
3
4
5
6
7
8
9
10
function fun(){
    var select = document.getElementById("test");
    var str = [];
    for(i=0;i<select.length;i++){
        if(select.options[i].selected){
            str.push(select[i].value);
        }
    }
    alert(str);
}

3、效果演示

js怎么能取得多选下拉框选中的多个值?的更多相关文章

  1. js:jquery multiSelect 多选下拉框实例

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 多选下拉框带搜索(aps.net)

    自己写了一个带搜索功能的多选下拉框,为了要获取值,就没有封装插件,实现思路 1.一个文本框 做搜索 2.一个文本框显示选中文本,一个隐藏控件存值 3.一个div里面绑定CheckBoxList控件(这 ...

  3. js多选下拉框

    1.js原生实现 1.1:引用JS文件 /*! jQuery v1.12.4 | (c) jQuery Foundation | jquery.org/license */ !function(a,b ...

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

    bootstrap-multiselect.js多选下拉框默认值设置 一.案例数据格式  二.HTML代码 <select id="msgRoles" multiple=&q ...

  5. Easyui-Combobox多选下拉框

    因为工作需要,引入combobox多选下拉框,并且获取选择的值并以","分开. 效果如下: 代码如下: <html> <head> <title> ...

  6. Bootstrap3级联多选下拉框

    <!DOCTYPE html> <html> <head> <title>Bootstrap3级联多选下拉框</title> <met ...

  7. query多选下拉框插件 jquery-multiselect(修改)

    其实网上关于该控件的使用教程已经很多了,其中 query多选下拉框插件 jquery-multiselect Jquery多选下拉列表插件jquery multiselect功能介绍及使用 这2个的介 ...

  8. MVC实现多选下拉框,保存并显示多选项

    在"MVC实现多选下拉框"中,主要是多选下拉框的显示,而实际情况通常是:选择多个选项提交后,需要在编辑页把所有选中的项显示出来. 模拟这样的一个场景:一个车迷可能有多个自己喜欢的汽 ...

  9. MVC实现多选下拉框

    借助Chosen Plugin可以实现多选下拉框. 选择多项: 设置选项数量,比如设置最多允许2个选项: 考虑到多选下拉<select multiple="multiple" ...

随机推荐

  1. Numpy 模块的应用

    数据分析三剑客: Numpy, Pandas, Matplotlib NumPy(Numerical Python) 是 Python 语言的一个扩展程序库,支持大量的维度数组与矩阵运算,此外也针对数 ...

  2. Mysql 数据类型 以及约束

    数据类型 整型 默认有符号 无符号(unsigned) 和有符号 用 0 填充 zerofill 约束的作用: 保证数据的完整性 和一致性 tinyint[ -128 , 127 ] 小整数 无符号( ...

  3. Linux的常见问题解答和管理技巧

    Linux的常见问题解答和管理技巧 一. 如何建立多用户 提醒大家一句,别一直使用root用户,因为root用户在系统中有着至高无上的权力,一不小心就可能破坏系统.比如我们想删除/temp目录下的文件 ...

  4. JavaScript中的栈内存和堆内存

    首先JavaScript中的变量分为基本类型和引用类型.基本类型就是保存在栈内存中的简单数据段,而引用类型指的是那些保存在堆内存中的对象. 1.基本类型 基本类型有Undefined.Null.Boo ...

  5. No.0

    算法类 1.快速排序算法 2.树的非递归后序排序算法 3.希尔排序 4.冒泡排序 5.链表和链表转向 6.其他   设计模式 1.单例模式 2.工厂模式 3.抽象工厂模式 4.面向对象设计,ooa,o ...

  6. 當 Alexa 遇上 ESP8266 (一)

    https://www.birdandgua.net/bird/2017/12/when_alexa_meets_esp8266-1/ 去年的 AWS 的 re:Invent 上,我見識了 Alexa ...

  7. RabbitMQ学习系列

    http://www.cnblogs.com/zhangweizhong/category/855479.html https://www.cnblogs.com/zhangweizhong/p/56 ...

  8. Spring Security(二十七):Part II. Architecture and Implementation

    Once you are familiar with setting up and running some namespace-configuration based applications, y ...

  9. ML.NET 示例:推荐之场感知分解机

    写在前面 准备近期将微软的machinelearning-samples翻译成中文,水平有限,如有错漏,请大家多多指正. 如果有朋友对此感兴趣,可以加入我:https://github.com/fei ...

  10. Linux Namespace : Network

    Network namespace 在逻辑上是网络堆栈的一个副本,它有自己的路由.防火墙规则和网络设备.默认情况下,子进程继承其父进程的 network namespace.也就是说,如果不显式创建新 ...