js怎么能取得多选下拉框选中的多个值?

js怎么能取得多选下拉框选中的多个值?

方法:获取多选下拉框对象数组→循环判断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怎么能取得多选下拉框选中的多个值?

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/112389.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • linux中设置固定ip(亲测有效)[通俗易懂]

    linux中设置固定ip(亲测有效)[通俗易懂]首先打开虚拟机  打开xshell5连接虚拟机(比较方便,这里默认设置过Linux的ip,只是不固定)输入ifconfig,可以查看网管相关配置信息:然后输入  vi/etc/sysconfig/network-scripts/ifcfg-ens33命令。修改网卡配置文件按i键进行编辑。修改入下,原有的配置不要删,只要按下面修改就好。没有的配置项新增上去就…

    2022年5月5日
    48
  • sai2 常用快捷键 2020

    sai2 常用快捷键 2020Ctrl+A全选Ctrl+B从剪贴板创建画布Ctrl+D取消选择Ctrl+E合并图层Ctrl+H显示选区边缘Ctrl+Y还原Ctrl+T自由变换Ctrl+R显示尺子按Shift可调节比例Ctrl+U色相Ctrl+X剪贴Ctrl+W关闭视图Shift+PageUp逆时针旋转Shift+PageDown顺时针旋转[小一号画笔]大一号画笔Delete清除图层%0~9%更改画笔浓度(小键盘)A选区笔B喷枪C水彩笔E橡皮擦H水平翻

    2022年6月18日
    197
  • js 判断数组中是否包含某个元素_前端数组包含某个元素

    js 判断数组中是否包含某个元素_前端数组包含某个元素Array.prototype.S=String.fromCharCode(2); Array.prototype.in_array=function(e){ varr=newRegExp(this.S+e+this.S); return(r.test(this.S+this.join(this.S)+this.S)); }; vararr=

    2022年10月19日
    3
  • Java正则表达式的语法与示例

    Java正则表达式的语法与示例Java正则表达式的语法与示例正则表达式是什么?用我的理解就是一个表达式。用来匹配,替换,判断字符串,之前业务就出现过判断返回值是否为邮箱。以下内容来自于http://baike.xsoftlab.net/view/207.html#3java正则表达式正则表达式语法java正则表达式语法java正则表达式概要:Java正则表达式的语法与示例

    2022年7月19日
    17
  • Android 编译_android线程

    Android 编译_android线程之前本地环境编译一直是正常的,后来更新代码后,出现编译不过。提示outofmemory,但是查看swap和内存都还是够的。里面有个提示,tryincreasingheapsizewithjavaoption’-Xmx’,就按照这个来改。失败截图:解决方案:exportJACK_SERVER_VM_ARGUMENTS=”-Dfile.e

    2025年9月18日
    5
  • 剑指 Offer:Redis 的 14 大使用场景!

    剑指 Offer:Redis 的 14 大使用场景!

    2022年2月11日
    58

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号