如何利用javascript获取表单中select下拉列表中所选中项的值value

简介:
1
1.html代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
< html >
< head >
</ head >
< body >
< form  name="form1" id="form1">
Select your favorite fruit:
< select  id="mySelect" name="mySelect">
< option  value="11">Apple</ option >
< option  value="22" >Orange</ option >
< option  value="33">Pineapple</ option >
< option  value="44">Banana</ option >
</ select >
< br  />< br  />
< input  type="button" onclick="getIndex()"
value="Alert index of selected option">
</ form >
</ body >
</ html >

 2.javascript代码如下:

1
2
3
4
5
6
7
8
9
10
<script type= "text/javascript" >
function  getIndex()
{
   //从document对象中,获取select标签
   var  a=document.getElementById( "mySelect" );
   //select标签获取的值其实是一个数组--a.options[]; 然后,选定项的下标是--a.selectedIndex
    var  b=a.options[a.selectedIndex].value;   
    alert(b);
}
</script>

  

本文转自二郎三郎博客园博客,原文链接:http://www.cnblogs.com/haore147/p/3617920.html,如需转载请自行联系原作者
相关文章
|
10月前
ractive.js联系表单动画效果源码
一款ractive.js联系表单动画效果,很有创意的发送邮件、联系内容等表单,基于ractive.js实现的动画效果,以发送信件的方式。
91 1
|
10月前
|
前端开发 JavaScript 安全
HTML+CSS+JS密码灯登录表单
通过结合使用HTML、CSS和JavaScript,我们创建了一个带有密码强度指示器的登录表单。这不仅提高了用户体验,还帮助用户创建更安全的密码。希望本文的详细介绍和代码示例能帮助您在实际项目中实现类似功能,提升网站的安全性和用户友好性。
165 3
|
11月前
|
JavaScript 数据安全/隐私保护
2024了,你会使用原生js批量获取表单数据吗
2024了,你会使用原生js批量获取表单数据吗
172 4
|
11月前
|
JavaScript 前端开发 数据安全/隐私保护
前端技术分享:使用Vue.js构建响应式表单
【10月更文挑战第1天】前端技术分享:使用Vue.js构建响应式表单
|
移动开发 前端开发 JavaScript
JavaScript 表单
JavaScript 表单
61 9
|
12月前
|
移动开发 JavaScript 前端开发
js之操作表单 | 12-4
js之操作表单 | 12-4
|
前端开发 微服务 API
微服务浪潮下的JSF革新:如何在分散式架构中构建统一而强大的Web界面
【8月更文挑战第31天】随着微服务架构的兴起,企业将应用拆分成小型、独立的服务以提高系统可维护性和可扩展性。本文探讨如何在微服务架构下构建和部署JavaServer Faces (JSF) 应用,通过RESTful服务实现前后端分离,提升灵活性和适应性。
144 1
|
人工智能 前端开发 JavaScript
react js 处理表单( form )的2个例子
react js 处理表单( form )的2个例子
|
大数据 数据处理 分布式计算
JSF 逆袭大数据江湖!看前端框架如何挑战数据处理极限?揭秘这场技术与勇气的较量!
【8月更文挑战第31天】在信息爆炸时代,大数据已成为企业和政府决策的关键。JavaServer Faces(JSF)作为标准的 Java Web 框架,如何与大数据技术结合,高效处理大规模数据集?本文探讨大数据的挑战与机遇,介绍 JSF 与 Hadoop、Apache Spark 等技术的融合,展示其实现高效数据存储和处理的潜力,并提供示例代码,助您构建强大的大数据系统。
127 0
|
Devops 持续交付 测试技术
JSF遇上DevOps:开发流程将迎巨变?一篇文章带你领略高效协同的魅力!
【8月更文挑战第31天】本文探讨了如何在JavaServer Faces(JSF)开发中融入DevOps文化,通过持续集成与部署、自动化测试、监控与日志记录及反馈机制,提升软件交付速度与质量。文中详细介绍了使用Jenkins进行自动化部署、JUnit与Selenium进行自动化测试、ELK Stack进行日志监控的具体方法,并强调了持续改进的重要性。
126 0