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怎么能取得多选下拉框选中的多个值?

 

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

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

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • Vue(4)Vue指令的学习1

    Vue(4)Vue指令的学习1前言Vue官网一共有提供了14个指令,分别如下v-textv-htmlv-showv-if☆☆☆v-else☆☆☆v-else-if☆☆☆v-for☆☆☆v-on☆☆☆v

  • python数据可视化第三方库有哪些_数据可视化!看看程序员大佬都推荐的几大Python库…

    python数据可视化第三方库有哪些_数据可视化!看看程序员大佬都推荐的几大Python库…数据可视化是数据分析中极为重要的部分,而数据可视化图表(如条形图,散点图,折线图,地理图等)也是非常关键的一环。Python作为数据分析中最流行的编程语言之一,有几个库可以创建精美而复杂的数据可视化,允许分析人员和统计人员通过方便地在一处提供界面和数据可视化工具而轻松地根据其规范创建可视数据模型!MatplotlibMatplotlib是Python的数据可视化库和二维绘图库,它是Python社区…

  • CloudSim仿真流程研究(二)[通俗易懂]

    CloudSim仿真流程研究(二)[通俗易懂]org.cloudbus.cloudsim.examples.power.random里的例子IqrMc:publicclassIqrMc{ /** *Themainmethod. * *@paramargsthearguments *@throwsIOExceptionSignalsthatanI/Oexceptionhasocc…

    2022年10月13日
  • BN层和Dropout层「建议收藏」

    BN层和Dropout层「建议收藏」原理batch的训练方法:按照batch来更新梯度,减少了梯度下降时的随机性;与遍历整个数据集相比,减少计算量。步骤:求batch均值、batch方差对每个元素进行归一化尺度缩放和偏移(变换回数据原始分布,减少)思想参数用法BN层放在卷积层后,用于重新调整数据分布…

  • double保留小数点后两位_double截取两位小数

    double保留小数点后两位_double截取两位小数publicclassDoubleTest{//保留两位小数第三位如果大于4会进一位(四舍五入)doublef=6.23556;/***使用精确小数BigDecimal*/publicvoidfun1(){BigDecimalbg=newBigDecimal(f);/…

    2022年10月20日
  • pycharm中使用anaconda部署python环境_anaconda pycharm环境配置

    pycharm中使用anaconda部署python环境_anaconda pycharm环境配置总有那么多的知识点,看起来这么简单(其实解决的方法也很简单,无非是某个地方要加括号,要加双括号等小问题),但没有人好好讲的话会浪费很多时间。笔者先安装了Anaconda和Spyder,运行TensorFlow-GPU,最近安装了pycharm,想利用之前配置好的环境(省去依赖包的配置)。找了一些资源都没有将清楚。以下简洁版:1、新建项目,选择“Existinginterpreter”…

发表回复

您的电子邮箱地址不会被公开。

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