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. dl在不同浏览器下显示不同

    dl在chrome浏览器和在火狐浏览器下的默认样式是不一样的,解决方法将dl换成ol或ul样式就正常了.

  2. selenium模拟浏览器对搜狗微信文章进行爬取

    在上一篇博客中使用redis所维护的代理池抓取微信文章,开始运行良好,之后运行时总是会报501错误,我用浏览器打开网页又能正常打开,调试了好多次都还是会出错,既然这种方法出错,那就用selenium模 ...

  3. mysql插入数据时检查是否某字段已存在

    SELECT\n" + " '',\n" + " '{0}',\n" + " '{1}',\n" + " '{2}'\n ...

  4. JavaScript中涉及得运算符以及运算符的优先级

    在js中主要有三种运算符:算术运算符,逻辑与比较运算符,位运算符.在着三种运算符中,最常见的应该是算术与比较运算符,位运算符比较少见一些 *说到了运算符,就不得不说运算符的优先级.下面我来列一下这些运 ...

  5. Windows Server 2016-部署RODC只读域控制器

    只读域控制器Read-Only Domain Controller简称RODC.RODC是Windows Server 2008之后引入的一活动目录特性,与其他域控制器一样包含AD数据库,但RODC默 ...

  6. java环境搭建 windows

    windows搭建Java环境 1.下载java开发工具jdk安装包 下载地址:http://www.oracle.com/technetwork/java/javase/downloads/inde ...

  7. 关于 IO的同步异步间要描述

    IO在计算机中指Input/Output,也就是输入和输出.由于程序和运行时数据是在内存中驻留,由CPU这个超快的计算核心来执行,涉及到数据交换的地方,通常是磁盘.网络等,就需要IO接口. 比如你打开 ...

  8. paping使用来测试联通&网站由于tcp协议导致的无法通信问题超时问题

    1. 使用paping来测试连通性 Linux 平台: : wget http://www.updateweb.cn/softwares/paping_1.5.5_x86-64_linux.tar.g ...

  9. PH日期格式化

    %M 月名字(January--December) %W 星期名字(Sunday--Saturday) %D 有英语前缀的月份的日期(1st, 2nd, 3rd, 等等.) %Y 年, 数字, 4 位 ...

  10. better-scroll 源码分析

    我写该文章,主要是想结合代码探究 better-scroll 是如何处理下列操作的.该过程如下图,用文字描述为:手指触摸屏幕,向上快速滑动,最后在手指离开屏幕后,内容获得动量继续滚动,到头部后在移动一 ...