JavaScript获取onclick、onchange等事件值的代码


Posted in Javascript onJuly 22, 2013

今天小菜处理下拉菜单级联问题时,想获取HTML标签中某个事件的内容,也就是值,比如从<select id="city" onchange="javascript:test();"></select>中获取javascript:test();。
小菜想通过事件中的信息,确定下一级的菜单,但是这个貌似很简单的问题,却让小菜纠结了一番。
稍微懂点JQuery的童鞋,可能会尝试这样获取:

$(document).ready(function(){ 
var onchangeValue = $("#city").attr("onchange"); 
alert(onchangeValue); 
});

一般情况下,这样的确可以获取到,因为JQuery万能的attr方法,可以获取标签中任何的”属性”,即使是一个事件,也可以直接获取内容,这里onchange就是事件。
但小菜在实际开发环境中,用这个方法怎么也获取不到,得到的均是undefined。
在纠结之际,发现了另外一种用纯JavaScript实现获取的方法。
具体代码如下:
$(document).ready(function(){ 
var onchangeValue = document.getElementById("city").getAttributeNode("onchange").nodeValue; 
alert(onchangeValue); 
});

简单说一下,这里主要是用到了getAttributeNode()这个方法,它获取的是属性节点,忽略属性和事件的差别,类似于对XML的处理,然后再用nodeValue获得属性节点的节点值。
如果使用getAttribute()方法,由于onchange是一个事件,因此获取的是一个函数对象,无法当成字符串处理。
希望这篇文章能够帮助需要的童鞋。
Javascript 相关文章推荐
IE网页js语法错误2行字符1、FF中正常的解决方法
Sep 09 Javascript
jquery教程限制文本框只能输入数字和小数点示例分享
Jan 13 Javascript
详解JavaScript中shift()方法的使用
Jun 09 Javascript
jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象的方法
Aug 25 Javascript
基于JavaScript实现购物网站商品放大镜效果
Sep 06 Javascript
Angular的模块化(代码分享)
Dec 26 Javascript
bootstrap输入框组件使用方法详解
Jan 19 Javascript
ES7中利用Await减少回调嵌套的方法详解
Nov 01 Javascript
微信小程序自定义弹出层效果
May 26 Javascript
详解JS预解析原理
Jun 16 Javascript
jQuery实现穿梭框效果
Jan 19 jQuery
原生js实现自定义滚动条组件
Jan 20 Javascript
offsetHeight在OnLoad中获取为0的现象
Jul 22 #Javascript
用jQuery获取IE9下拉框默认值问题探讨
Jul 22 #Javascript
JS 实现图片直接下载示例代码
Jul 22 #Javascript
js操作iframe兼容各种主流浏览器示例代码
Jul 22 #Javascript
JavaScript的模块化:封装(闭包),继承(原型) 介绍
Jul 22 #Javascript
JS判定是否原生方法
Jul 22 #Javascript
js图片延迟加载的实现方法及思路
Jul 22 #Javascript
You might like
SONY ICF-SW07收音机电路分析
2021/03/02 无线电
关于BIG5-HKSCS的解决方法
2007/03/20 PHP
php zlib压缩和解压缩swf文件的代码
2008/12/30 PHP
php中根据某年第几天计算出日期年月日的代码
2011/02/24 PHP
Prototype最新版(1.5 rc2)使用指南(1)
2007/01/10 Javascript
谷歌浏览器 insertCell与appendChild的区别
2009/02/12 Javascript
ExtJS下书写动态生成的xml(兼容火狐)
2013/04/02 Javascript
js和css写一个可以自动隐藏的悬浮框
2014/03/05 Javascript
使用script的src实现跨域和类似ajax效果
2014/11/10 Javascript
js实现鼠标触发图片抖动效果的方法
2015/02/27 Javascript
移动端使用localStorage缓存Js和css文的方法(web开发)
2016/09/20 Javascript
Bootstrap基本样式学习笔记之图片(6)
2016/12/07 Javascript
微信小程序 跳转传递数据的实例
2017/07/06 Javascript
微信小程序 Buffer缓冲区的详解
2017/07/06 Javascript
JavaScript使用prototype原型实现的封装继承多态示例
2018/08/31 Javascript
node基于async/await对mysql进行封装
2019/06/20 Javascript
京东优选小程序的实现代码示例
2020/02/25 Javascript
详解React 条件渲染
2020/07/08 Javascript
vue在响应头response中获取自定义headers操作
2020/07/24 Javascript
PyMongo安装使用笔记
2015/04/27 Python
Python中的is和==比较两个对象的两种方法
2017/09/06 Python
python实现用户管理系统
2018/01/10 Python
详解Python安装scrapy的正确姿势
2018/06/26 Python
使用 Python 实现微信群友统计器的思路详解
2018/09/26 Python
python实现桌面壁纸切换功能
2019/01/21 Python
详解python运行三种方式
2019/05/13 Python
python中利用matplotlib读取灰度图的例子
2019/12/07 Python
tensorflow 重置/清除计算图的实现
2020/01/19 Python
tensorboard实现同时显示训练曲线和测试曲线
2020/01/21 Python
墨西哥运动服饰和鞋网上商店:Netshoes墨西哥
2016/07/28 全球购物
俄罗斯名牌服装网上商店:UNIQUE FABRIC
2019/07/25 全球购物
公司部门司机岗位职责
2014/01/03 职场文书
2015大学生求职信范文
2015/03/20 职场文书
团拜会主持词
2015/07/04 职场文书
小学生红领巾广播稿
2015/08/19 职场文书
一文搞清楚MySQL count(*)、count(1)、count(col)区别
2022/03/03 MySQL