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. JavaScript 基本语法 -- 数据类型 & 变量

    JavaScript都有哪些数据类型呢? 在JavaScript里面,数据类型分为两类:原始类型(primitive type)和对象类型(object type) 1. 原始类型(我的理解,不可分割 ...

  2. CSS中的选择器之类选择器和id选择器

    1.css中的选择器: 1.类选择器,又叫class选择器 2.id选择器 3.html元素选择器(又叫标签选择器) 4.通配符选择器 5.伪类选择器 6.组合选择器(多元素选择器,子元素选择器,后代 ...

  3. RMI基础

    远程方法调用(Remote Method Invocation,RMI)从JDK1.1就已经实现,它大大增强了Java开发分布式应用的能力.可以实现通过网络完成不同JVM间的通信,不仅可以传递基本的数 ...

  4. POJ 2404 Jogging Trails [DP 状压 一般图最小权完美匹配]

    传送门 题意:找一个经过所有边权值最小的回路,$n \le 15$ 所有点度数为偶则存在欧拉回路,直接输出权值和 否则考虑度数为奇的点,连着奇数条边,奇点之间走已经走过的路移动再走没走过的路 然后大体 ...

  5. ZOJ1450 BZOJ1136 BZOJ1137 HDU3932[最小圆覆盖]

    Minimal Circle Time Limit: 5 Seconds      Memory Limit: 32768 KB You are to write a program to find ...

  6. JavaScript语言学习中的注意事项

    javascript: 基于浏览器 基于对象 事件驱动 脚本语言 由: javascript: ECMAscript(ES) DOM文档对象模型 BOM浏览器对象模型,三部分组成 使用js的三种方式 ...

  7. python语言基础汇总

    注释 代码中添加注释是一个良好的编程习惯,python语言的注释才用井号'#'作为注释开头的,可以是任意内容,解释器会忽略掉这部分内容.其他每一行都是语句,当语句以冒号':'结尾时,缩进的语句视为代码 ...

  8. Python中的浅拷贝与深拷贝

    编者注:本文主要参考了<Python核心编程(第二版)> 以下都是参考资料后,我自己的理解,如有错误希望大家不吝赐教. 大家有没有遇到这样一种情况,对象赋值后,对其中一个变量进行修改,另外 ...

  9. selenium headlesschrome下设置最大窗口模式

    做微博登录的时候,用selenium的chrome界面模式,可以用下面方式显示最大窗口: from selenium.webdriver.chrome.options import Options c ...

  10. php.ini 中文详解

    [PHP]  ; PHP还是一个不断发展的工具,其功能还在不断地删减  ; 而php.ini的设置更改可以反映出相当的变化,  ; 在使用新的PHP版本前,研究一下php.ini会有好处的   ;;; ...