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 相关文章推荐
屏蔽script注入小例子
Nov 12 Javascript
解决json日期格式问题的3种方法
Feb 02 Javascript
JavaScript的模块化开发框架Sea.js上手指南
May 12 Javascript
JS定时器实现数值从0到10来回变化
Dec 09 Javascript
Bootstrap进度条学习使用
Feb 09 Javascript
Vue2.0组件间数据传递示例
Mar 07 Javascript
jQuery插件HighCharts实现的2D回归直线散点效果示例【附demo源码下载】
Mar 09 Javascript
vue权限路由实现的方法示例总结
Jul 29 Javascript
jQuery实现checkbox全选、反选及删除等操作的方法详解
Aug 02 jQuery
JavaScript函数IIFE使用详解
Oct 21 Javascript
使用vue cli4.x搭建vue项目的过程详解
May 08 Javascript
基于js实现数组相邻元素上移下移
May 19 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
DC宇宙的第一个英雄,堪称动漫史鼻祖,如今成为美国文化的象征
2020/04/09 欧美动漫
PHP中路径问题的解决方案
2006/10/09 PHP
PHP原生函数一定好吗?
2014/12/08 PHP
PHP实现上传文件并存进数据库的方法
2015/07/16 PHP
如何在PHP中使用数组
2020/06/09 PHP
JS三级可折叠菜单实现方法
2016/02/29 Javascript
JS实现点击链接切换显示隐藏内容的方法
2017/10/19 Javascript
JavaScript中常见内置函数用法示例
2018/05/14 Javascript
JavaScript数据结构与算法之基本排序算法定义与效率比较【冒泡、选择、插入排序】
2019/02/21 Javascript
使用Vue 实现滑动验证码功能
2019/06/27 Javascript
countUp.js实现数字动态变化效果
2019/10/17 Javascript
Python 解析XML文件
2009/04/15 Python
Unicode和Python的中文处理
2017/03/19 Python
python利用标准库如何获取本地IP示例详解
2017/11/01 Python
分析Python读取文件时的路径问题
2018/02/11 Python
使用k8s部署Django项目的方法步骤
2019/01/14 Python
Python socket模块实现的udp通信功能示例
2019/04/10 Python
wxpython绘制音频效果
2019/11/18 Python
关于Python-faker的函数效果一览
2019/11/28 Python
Python内置类型性能分析过程实例
2020/01/29 Python
Selenium之模拟登录铁路12306的示例代码
2020/07/31 Python
python爬取”顶点小说网“《纯阳剑尊》的示例代码
2020/10/16 Python
CSS3的 fit-content实现水平居中
2017/09/07 HTML / CSS
html5 canvas绘制网络字体的常用方法
2019/08/26 HTML / CSS
高中生自我鉴定范文
2013/10/30 职场文书
大学团支书的自我评价分享
2013/12/14 职场文书
物流业务员岗位职责
2014/02/08 职场文书
学习十八大坚定理想信念心得体会
2014/03/11 职场文书
办公室打字员岗位职责
2014/04/16 职场文书
英语自我介绍演讲稿
2014/09/01 职场文书
群众路线学习心得体会范文
2014/11/05 职场文书
民事起诉状范文
2015/05/19 职场文书
买卖合同纠纷代理词
2015/05/25 职场文书
青年教师听课心得体会
2016/01/15 职场文书
python使用pygame创建精灵Sprite
2021/04/06 Python
Java 超详细讲解hashCode方法
2022/04/07 Java/Android