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）选中第二项

JavaScript获取select下拉框中的第一个值的更多相关文章

  1. JavaScript解决select下拉框中的内容太长显示不全的问题

    JavaScript解决select下拉框中的内容太长显示不全的问题 1.说明 有些情况下,select下拉框的内容过长,导致部分看不见: 现在通过鼠标事件,让下拉框中的内容显示完全 2.实现源码 & ...

  2. JavaScript向select下拉框中加入和删除元素

    JavaScript向select下拉框中加入和删除元素 1.说明 a   利用append()方法向下拉框中加入元素 b   利用remove()方法移除下拉框中最后一个元素 2.设计源代码 < ...

  3. JavaScript向select下拉框中添加和删除元素

    JavaScript向select下拉框中添加和删除元素 1.说明 a   利用append()方法向下拉框中添加元素 b   利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...

  4. JavaScript获取Select下拉框Option的Value和Text值的方法

    Js获取select下拉列表框各个Option的Value值相对比较容易,不过获取Text值却有点麻烦,对于一个初学JavaScript的 新手来说,可能一时还无从下手,那么就请看下本文的方法,以一个 ...

  5. Javascript获取select下拉框选中的的值

    现在有一id=test的下拉框,怎么拿到选中的那个值呢? 分别使用javascript原生的方法和jquery方法 <select id="test"  name=" ...

  6. js获取select下拉框中的值

    现在有一id为userType的下拉框,怎么获取选中的值: 用户类型: <select name="type" id="userType"> < ...

  7. 如何获取select下拉框中option选中的文本值

    $(select的id或者class).change(function(){ $(this).find("option:selected").text() }) 源文:https: ...

  8. jquery选中将select下拉框中一项后赋值给text文本框

    jquery选中将select下拉框中一项后赋值给text文本框,出现无法将第一个下拉框的value赋值给文本框 因为select默认选中第一项..在选择第一项时,便导致无法激发onchange事件. ...

  9. js&jquery 获取select下拉框的值、文本内容、自定义属性

      js&jquery 获取select下拉框的值.文本内容.自定义属性 CreationTime--2018年7月2日09点22分 Author:Marydon html <selec ...

随机推荐

  1. CRM项目-1模型与站点管理

    一.项目环境 语言:python3 IDE:pycharm 组件:bootstarp,jQuery 二.模型 2.1编写模型 联合唯一 class Meta:显示中文名. 认证使用django自带的U ...

  2. Go笔记-继承

    [Go中继承的实现]     当一个匿名类型被内嵌在结构体中时,匿名类型的可见方法也同样被内嵌,这在效果上等同于外层类型 继承 了这些方法:将父类型放在子类型中来实现亚型 package main i ...

  3. HDU 5996 dingyeye loves stone [阶梯Nim]

    dingyeye喜欢和你玩石子游戏. dingyeye有一棵nn个节点的有根树,节点编号为00到n−1n−1,根为00号节点.游戏开始时,第ii个节点上有a[i]a[i]个石子.两位玩家轮流操作,每次 ...

  4. HDU1013，1163 ，2035九余数定理 快速幂取模

    1.HDU1013求一个positive integer的digital root,即不停的求数位和,直到数位和为一位数即为数根. 一开始,以为integer嘛,指整型就行吧= =(too young ...

  5. typedef void(*Fun)(void);

    typedef void(*Fun)(void); 函数类似于数组,函数名就是它的首地址: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 ...

  6. Windows使用问题总结

    1 电脑休眠恢复之后无法识别Wifi无线网络 首先,重启电脑:其次,打开网络和共享中心,点击更改适配器设置:最后,在对应的无线网络连接图标上点击鼠标右键,属性,配置,电源选项,允许计算机关闭此设备以节 ...

  7. MySQL中order by排序时，数据存在null咋办

    order by排序是最常用的功能,但是排序有时会遇到数据为空null的情况,这样排序就会乱了,这里以MySQL为例,记录我遇到的问题和解决思路. 问题: 网页要实现table的行鼠标拖拽排序,我用A ...

  8. ubuntu下双网卡桥接

    1. 安装 brctl工具 sudo apt-get install bridge-utils 2. 添加桥 # brctl addbr br0 #创建桥接 br0 # brctl addif br0 ...

  9. 加入GIMPS项目，寻找梅森素数！

    截止到目前为止人类共找到了50个梅森素数,其中最后16个梅森素数都是通过GIMPS项目找到的. 为了激励人们寻找梅森素数和促进网格技术发展,总部设在美国旧金山的电子前沿基金会(EFF)于1999年3月 ...

  10. 高并发场景下的httpClient优化使用

    1.背景 我们有个业务,会调用其他部门提供的一个基于http的服务,日调用量在千万级别.使用了httpclient来完成业务.之前因为qps上不去,就看了一下业务代码,并做了一些优化,记录在这里. 先 ...