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 相关文章推荐
翻译整理的jQuery使用查询手册
Mar 07 Javascript
JavaScript this调用规则说明
Mar 08 Javascript
javascript 45种缓动效果 非常酷
Jun 28 Javascript
模拟一个类似百度google的模糊搜索下拉列表
Apr 15 Javascript
jQuery使用height()获取高度需要注意的地方
Dec 13 Javascript
详解Vue.js之视图和数据的双向绑定(v-model)
Jun 23 Javascript
AngularJS实现页面跳转后自动弹出对话框实例代码
Aug 02 Javascript
React 源码中的依赖注入方法
Nov 07 Javascript
vue-cli 2.*中导入公共less文件的方法步骤
Nov 22 Javascript
js前端面试之同步与异步问题详解
Apr 03 Javascript
JavaScript HTML DOM 元素 (节点)新增,编辑,删除操作实例分析
Mar 02 Javascript
springboot+vue实现文件上传下载
Nov 17 Vue.js
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
用php实现批量查询清除一句话后门的代码
2008/01/20 PHP
PHP 引用文件技巧
2010/03/02 PHP
第七章 php自定义函数实现代码
2011/12/30 PHP
php中strtotime函数用法详解
2014/11/15 PHP
CentOS下PHP安装Oracle扩展
2015/02/15 PHP
php 升级到 5.3+ 后出现的一些错误,如 ereg(); ereg_replace(); 函数报错
2015/12/07 PHP
PHP的压缩函数实现:gzencode、gzdeflate和gzcompress的区别
2016/01/27 PHP
PHP匿名函数和use子句用法实例
2016/03/16 PHP
Yii2使用swiftmailer发送邮件的方法
2016/05/03 PHP
使用TextRange获取输入框中光标的位
2006/10/14 Javascript
jQuery AnythingSlider滑动效果插件
2010/02/07 Javascript
浅谈javascript的原型继承
2012/07/25 Javascript
jQuery判断元素上是否绑定了指定事件的方法
2015/03/17 Javascript
JQuery实现网页右侧随动广告特效
2016/01/17 Javascript
AngularJS创建自定义指令的方法详解
2016/11/03 Javascript
js实现简单选项卡功能
2020/03/23 Javascript
微信公众平台获取access_token的方法步骤
2019/03/29 Javascript
vue项目中在外部js文件中直接调用vue实例的方法比如说this
2019/04/28 Javascript
简单了解Javscript中兄弟ifream的方法调用
2019/06/17 Javascript
[51:17]Mineski vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.22
2019/09/05 DOTA
Python编写生成验证码的脚本的教程
2015/05/04 Python
使用py2exe在Windows下将Python程序转为exe文件
2016/03/04 Python
python字典的常用操作方法小结
2016/05/16 Python
Python 一句话生成字母表的方法
2019/01/02 Python
Python中的Socket 与 ScoketServer 通信及遇到问题解决方法
2019/04/01 Python
分析经典Python开发工程师面试题
2019/04/08 Python
python实现从尾到头打印单链表操作示例
2020/02/22 Python
如何基于python3和Vue实现AES数据加密
2020/03/27 Python
解决Python3.7.0 SSL低版本导致Pip无法使用问题
2020/09/03 Python
Opencv常见图像格式Data Type及代码实例
2020/11/02 Python
HTML5 weui使用笔记
2019/11/21 HTML / CSS
加拿大城市本地限时优惠:Buytopia.ca
2018/09/19 全球购物
英国和世界各地预订便宜的酒店:LateRooms.com
2019/05/05 全球购物
三八妇女节演讲稿
2014/05/27 职场文书
第二次离婚起诉书
2015/05/18 职场文书
大学生村官工作心得体会
2016/01/23 职场文书