JavaScript实现获取select下拉框中第一个值的方法
作者:翱翔天地 时间:2024-04-22 12:50:05
本文实例讲述了JavaScript实现获取select下拉框中第一个值的方法。分享给大家供大家参考,具体如下:
1、说明
获取select下拉框中的第一个值
2、实现源码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JavaScript获取select下拉框中的第一个值</title>
<script type="text/javascript">
/**
* JavaScript获取select下拉框中的第一个值
*/
function getFirstValOfSelect()
{
//获取select中的ID
var selectId = document.getElementById("select_option");
//获取select下拉框中第一个值
var selectValue = selectId.options[0].value;
//获取select下拉框中第一个文本值
var selectText = selectId.options[0].text;
//打印select下拉框中第一个值和文本值
alert("值:" + selectValue + "\n" + "文本值:" + selectText);
}
</script>
</head>
<body>
<div id="div_select">
<select id="select_option">
<option value="0">桃树</option>
<option value="1">梨树</option>
<option value="2">樟树</option>
<option value="3">枫树</option>
<option value="4">松树</option>
<option value="5">梧桐树</option>
<option value="6">槐树</option>
</select>
</div>
<input type="button" value="JavaScript获取select下拉框中的第一个值" onclick="getFirstValOfSelect()"/>
</body>
</html>
3、实现结果
(1)选中第一项
(2)选中第二项
希望本文所述对大家jQuery程序设计有所帮助。
来源:http://blog.csdn.net/you23hai45/article/details/37110171
标签:JavaScript,select下拉框


猜你喜欢
Python爬虫实例扒取2345天气预报
2021-09-27 22:38:12

mysql解析json数据组获取数据组所有字段的方法实例
2024-01-21 11:10:13

python爬虫增加访问量的方法
2021-08-23 06:32:23
Python Django框架介绍之模板标签及模板的继承
2021-11-05 01:36:56

laravel orm 关联条件查询代码
2024-03-08 02:57:53
vue简单实现购物车结算功能
2024-05-28 15:54:57

TensorFlow在MAC环境下的安装及环境搭建
2023-09-14 10:32:23

Django 日志配置按日期滚动的方法
2021-02-02 08:27:01
Python3连接Mysql8.0遇到的问题及处理步骤
2024-01-20 13:06:46

完美解决python3.7 pip升级 拒绝访问问题
2023-08-10 07:45:33

go 字符串修改的操作代码
2024-05-13 10:40:18
Bresenham图形算法JavaScript版本
2010-01-25 12:09:00
Java timezone设置和mybatis连接数据库时区设置方式
2024-01-24 09:43:18

Python3中函数参数传递方式实例详解
2022-05-22 23:32:20

Mysql InnoDB多版本并发控制MVCC详解
2024-01-23 16:46:25

SQL Server 2005 五个动态管理对象
2008-12-18 14:50:00
使用python从三个角度解决josephus问题的方法
2022-02-22 02:19:55
Eclipse配置python默认头过程图解
2022-03-11 10:52:59

纯CSS实现导航下拉菜单
2007-11-25 15:11:00

WEB页面工具语言XML带来的好处
2008-05-29 11:01:00