JS检测页面中哪个HTML标签触发点击事件的方法


Posted in Javascript onJune 17, 2016

本文实例讲述了JS检测页面中哪个HTML标签触发点击事件的方法。分享给大家供大家参考,具体如下:

在html标签中,为了页面显示的美观,会在标签中相互嵌套,在做“效果”的时候就难免不了的添加各种事件,例如:
<a href=""><span onclick="">dddd</span></a>
当用户点击的时候,想确定是链接产生的事件还是span标签onclick标签产生的事件,这个有时候是很有必要的,至少我认为在调试的时候有作用,因此我写了一个简单的demo,用于各位看官学习

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type="text/javascript">
//得到触发事件的控件
function test(obj){
//下面这种方式用来检测到底是哪个空间触发的事件的工具
  alert(window.event.srcElement.tagName);
}
</script>
<title>无标题文档</title>
</head>
<body>
  <input type="button" value="test" onclick="test(this)"/>
  <button type="button" value="test" onclick="test(this)">ddddd</button>
  <span type="button" value="test" onclick="test(this)">span</span>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript parseInt 函数分析(转)
Mar 21 Javascript
JQuery 1.6发布 性能提升,同时包含大量破坏性变更
May 10 Javascript
用示例说明filter()与find()的用法以及children()与find()的区别分析
Apr 26 Javascript
jquery获取URL中参数解决中文乱码问题的两种方法
Dec 18 Javascript
js取模(求余数)隔行变色
May 15 Javascript
Javascript动态引用CSS文件的2种方法介绍
Jun 06 Javascript
详解微信小程序 template添加绑定事件
Jun 23 Javascript
Angular5.1新功能分享
Dec 21 Javascript
关于Vue组件库开发详析
Jul 01 Javascript
JS使用Dijkstra算法求解最短路径
Jan 17 Javascript
详解Node.js amqplib 连接 Rabbit MQ最佳实践
Jan 24 Javascript
解决echarts 一条柱状图显示两个值,类似进度条的问题
Jul 20 Javascript
jquery.qtip提示信息插件用法简单实例
Jun 17 #Javascript
jQuery实现区域打印功能代码详解
Jun 17 #Javascript
javascript日期比较方法实例分析
Jun 17 #Javascript
JS实现复制内容到剪贴板功能兼容所有浏览器(推荐)
Jun 17 #Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
Jun 17 #Javascript
JavaScript简单实现弹出拖拽窗口(二)
Jun 17 #Javascript
JS中递归函数
Jun 17 #Javascript
You might like
ThinkPHP连接数据库的方式汇总
2014/12/05 PHP
Yii操作数据库实现动态获取表名的方法
2016/03/29 PHP
javascript日期转换 时间戳转日期格式
2011/11/05 Javascript
7款风格新颖的jQuery/CSS3菜单导航分享
2013/04/23 Javascript
JS控制一个DIV层在指定时间内消失的方法
2014/02/17 Javascript
javascript单页面手势滑屏切换原理详解
2016/03/21 Javascript
node.js插件nodeclipse安装图文教程
2020/10/19 Javascript
js中遍历对象的属性和值的方法
2016/07/27 Javascript
Node.js的文件权限及读写flag详解
2016/10/11 Javascript
javascript 判断一个对象为数组的方法
2017/05/03 Javascript
JS判断一个数是否是水仙花数
2017/06/11 Javascript
jQuery实现火车票买票城市选择切换功能
2017/09/15 jQuery
原生JS+CSS实现炫酷重力模拟弹跳系统的登录页面
2017/11/01 Javascript
webpack本地开发环境无法用IP访问的解决方法
2018/03/20 Javascript
layui实现点击按钮给table添加一行
2018/08/10 Javascript
vue父子组件的通信方法(实例详解)
2019/11/10 Javascript
python实现监控linux性能及进程消耗性能的方法
2014/07/25 Python
使用70行Python代码实现一个递归下降解析器的教程
2015/04/17 Python
使用python判断你是青少年还是老年人
2018/11/29 Python
python Django 创建应用过程图示详解
2019/07/29 Python
使用python实现男神女神颜值打分系统(推荐)
2019/10/31 Python
python实现大量图片重命名
2020/03/23 Python
根据tensor的名字获取变量的值方式
2020/01/04 Python
Python查找不限层级Json数据中某个key或者value的路径方式
2020/02/27 Python
Jmeter HTTPS接口测试证书导入过程图解
2020/07/22 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
雅诗兰黛旗下走天然植物路线的彩妆品牌:Prescriptives
2016/08/14 全球购物
什么是Smarty变量操作符?如何使用Smarty变量操作符
2014/07/18 面试题
继承时候类的执行顺序问题,一般都是选择题,问你将会打印出什么?
2015/11/18 面试题
党员培训思想汇报
2014/01/07 职场文书
婚前保证书
2014/04/29 职场文书
期末评语大全
2014/05/04 职场文书
医院保洁服务方案
2014/06/11 职场文书
大学课外活动总结
2014/07/09 职场文书
员工开除通知书
2015/04/25 职场文书
深入理解以DEBUG方式线程的底层运行原理
2021/06/21 Java/Android