示例代码如下(js直接写在了html里面，没有写在一个单独的外部文件中)：

<!DOCTYPE html>

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>select元素</title>

</head>

<body id="bodyform">

    <select id="month">

         <option  value="01">January</option>

         <option  value="02">February</option>

         <option  value="03" selected="selected">March</option>

         <option  value="04">April</option>

         <option  value="05">May</option>

         <option  value="06">June</option>

         <option  value="07">July</option>

         <option  value="08">August</option>

         <option  value="09">September</option>

         <option  value="10">October</option>

         <option  value="11">November</option>

         <option  value="12">December</option>

    </select>

    <div>

        <input type="button" onclick="showValue()" value="显示Value值"></input>

        <input type="button" onclick="showText()" value="显示Text值"></input>

    </div>

</body>

      <script type="text/javascript">

          function showValue(){

            /*获取select选中的对象的value*/

            var select=document.querySelector("#month");

            alert("Value值:"+select.value);

          }

          function showText(){

            /*获取select选中的对象的text*/

            var select=document.querySelector("#month");

             alert("Text值:"+select.options[select.selectedIndex].text);

          }

      </script>

</html>

界面：

运行效果如下：

点击显示Value值

点击显示Text值

使用JavaScript获取select元素选中的value和text的更多相关文章

  1. JQuery 获取select被选中的value和text

    html代码: <select name="test" > <option value="0">请选择</option> & ...

  2. JavaScript 获取Select标签选中的项

    <select name="select1" id="select1" onchange=setInput()> <option value= ...

  3. Javascript获取select的选中值和选中文本(转载)

    var obj = document.getElementById(”select_id”); //selectid var index = obj.selectedIndex; // 选中索引 va ...

  4. jQuery获取Select元素

    jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change(function(){//code...});   //为Se ...

  5. jQuery获取select元素选择器练习

    jQuery获取Select选择的Text和Value:语法解释: 1. $("#select_id").change(function(){//code...}); //为Sel ...

  6. JavaScript获取select下拉框中的第一个值

    JavaScript获取select下拉框中的第一个值 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  7. 获取select标签选中状态 的label的值。

    <select name="procode" onchange="alert(this.options[this.selectedIndex].text)" ...

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

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

  9. JavaScript获取html元素的实际宽度和高度

    一.JavaScript获取html元素宽高 1.宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offs ...

随机推荐

  1. （剑指Offer）面试题47：不用加减乘除做加法

    题目: 写一个函数,求两个整数之和,要求在函数体内不得使用+.-.*./四则运算符号. 思路: 很容易想到通过位运算来解决问题. 以5+17=22为例,参考十进制加法:1.只做各位相加不进位运算,即得 ...

  2. HDU4626+博弈

    博弈... /* 博弈 对于当前人来说,如果完成自己的操作后,若mat[n][m]==0,则自己是胜者. 因为 如果mat其他位置不存在1了,肯定自己胜:如果存在1,则让下一位去反转那个1. */ # ...

  3. SpringMVC配置全局日期转换器，处理日期转换异常

    Spring 3.1.1使用Mvc配置全局日期转换器,处理日期转换异常链接地址: https://www.2cto.com/kf/201308/236837.html spring3.0配置日期转换可 ...

  4. 如何发布本地maven项目jar包部署到nexus私服？

    首先在我们的pom里面描述我们要部署的地址: <distributionManagement> <repository> <id>release</id> ...

  5. CentOS 6上的redis搭建实战记录（转）

    redis 是一个基于内存的高性能key-value数据库,数据都保存在内存中定期刷新到磁盘,以极高的读写效率而备受关注.他的特点是支持各种数据结构,stirng,hashes, list,set,和 ...

  6. 【HTML入门】Html中块状元素和内联元素解析

    [HTML入门]Html中块状元素和内联元素解析 块元素(block element)一般是其他元素的容器元素,块元素一般都从新行开始,它可以容纳内联元素和其他块元素,内联元素(inline elem ...

  7. nginx配置静态文件过期时间

    1. 编辑虚拟主机配置文件/usr/local/nginx/conf/vhosts/huangzhenping.conf 说明:采用location方式 1 2 3 4 5 6 7 8 9 10  l ...

  8. Linux命令-用户管理命令:useradd，passwd，who，w

    who 查看登录用户 w 查看登录用户详细信息

  9. 怎样给ExecutorService异步计算设置超时

    ExecutorService接口使用submit方法会返回一个Future<V>对象.Future表示异步计算的结果.它提供了检查计算是否完毕的方法,以等待计算的完毕,并获取计算的结果. ...

  10. IntelliJ IDEA 学习（三）：IntelliJ IDEA 快捷键、配置优化

    一.两种方式可以设置快捷键: 1)setting -> keymap 想找到有关Idea工具的菜单或其他功能的话,可以再这里找到对应的快捷键   2)setting -> Editor - ...