在日常开发中,我们经常遇到选择框的业务处理:如何去获取我们所选中的数据呢? 很多小伙伴还不是很熟悉!

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head> <body> <!-- 原生方式获取被选中的值 -->
<select id="select">
<option >北京</option>
<option >上海</option>
<option >深圳</option>
<option >广州</option>
</select>
<script>
// console.log(select)
select.onchange = function(){
alert(this.value)
}
</script> </body> </html>

很多小伙伴还在用原生的js 去操作option的点击事件,然而这种做法是不对的呢!!!要获取选中的数据,我们用的是操作select 。使用onchange 事件就可以拿到我们想要的数据了,

这样是不是很方便呢?

select 如何在选中后获取选中的时是什么元素 ,(原生js)的更多相关文章

  1. JQuery判断radio是否选中,获取选中值

    本文摘自:http://www.cnblogs.com/xcj1989/archive/2011/06/29/JQUERY_RADIO.html   /*----------------------- ...

  2. JQuery判断radio是否选中并获取选中值的示例代码

    这篇文章主要介绍了JQuery判断radio是否选中并获取选中值的方法,代码很简单,但很实用,需要的朋友可以参考下 其他对radio操作功能,以后在添加.直接上代码,别忘记引用JQuery包 ? 1 ...

  3. JQuery - 判断radio是否选中,获取选中值

    代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...

  4. Jquery判断单选框是否选中和获取选中的值

    第一种:利用选中值判断选中 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...

  5. jQuery判断checkbox是否选中及获取选中值

    方法一:if ($("#checkbox-id")get(0).checked) {    // do something} 方法二:if($('#checkbox-id').is ...

  6. JQuery判断radio(单选框)是否选中和获取选中值

    一.设置选中方法 代码如下: $("input[name='名字']").get(0).checked=true; $("input[name='名字']"). ...

  7. jq 操作radio,设置选中、获取选中值

    <label><input type="radio" name="sex" value="1">男</labe ...

  8. jq操作radio,设置选中、获取选中值

    <label><inputtype="radio"name="sex"value="1">男</label&g ...

  9. JQuery判断checkbox选中,jquery获取选中的checkbox

    选中的radio $('input[name="radInvoiceType"]:checked').val(); 这样能获得 $('input[name="radInv ...

随机推荐

  1. jmeter使用csv进行参数化(一)

    先录制一个脚本,具体录制可以参考笔者的随笔:http://www.cnblogs.com/wuyazi/p/8889770.html 1.准备参数化文本内容:mac没有自带的txt文本编辑器,笔者是在 ...

  2. MYSQL的空间查询

    http://blog.sina.com.cn/s/blog_a48af8c001018q1p.html 本文将向各位介绍如何使用MySql5.x中的空间数据库,并展示一下它高效的性能(前提是正确使用 ...

  3. 12. thymeleaf中资源相对路径的解决

    把博客部署到tomcat上后才发现因之前资源和链接的地址都是使用的相对路径,这样一来在tomcat上就各种找不到资源.从网上看了几种解决方式都挺麻烦的,且不是适配的,所以我根据thymeleaf的规则 ...

  4. consoleWriter.go

    package blog4go import ( "fmt" "os" "time" ) // ConsoleWriter is a con ...

  5. bzoj 2822 [AHOI2012]树屋阶梯 卡特兰数

    因为规定n层的阶梯只能用n块木板 那么就需要考虑,多出来的一块木板往哪里放 考虑往直角处放置新的木板 不管怎样,只有多的木板一直扩展到斜边表面,才会是合法的新状态,发现,这样之后,整个n层阶梯就被分成 ...

  6. JavaScript对象的指向问题

    JavaScript对象的指向问题 标签(空格分隔): JavaScript 对象 在接触了JavaScript之后,我们常听到一句话就是一切皆对象,意思是说除了object以外,JavaScript ...

  7. SA SD SE 区别

    [SA(System Analysis)系统分析师] 通过一系列分析手法把User想要的结果,以各种文件方式表达出来. 此过程着重于工作流程和处理逻辑. 规划系统功能和模块. 定出初步的数据库内容及系 ...

  8. Navicat:实现两个数据库结构同步和数据库对比

    Navicat版本:Navicat Premium 12 选择 工具 ——> 结构同步 ​ 选择源数据库和目标数据库,选择完成后点击右下角对比按钮 ​ 要修改的对象:源数据库和目标数据库中都有的 ...

  9. Vue 进阶之路(二)

    之前的文章我们初识了 vue,对其原理,数据绑定和方法进行了简单的演示,本篇将对 vue 插值表达式,v-text,v-html 进行讲解. <!DOCTYPE html> <htm ...

  10. this指向和apply,call,bind三者的区别

    一.前言 this指向,apply,call,bind的区别是一个经典的面试问题,同时在项目中会经常使用到的原生的js方法.同时也是ES5中的众多坑的一个.ES6中可能会极大的避免了this产生的错误 ...