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编写COM组件的步骤
Mar 17 Javascript
jquery选择器排除某个DOM元素的方法(实例演示)
Apr 25 Javascript
从JQuery源码分析JavaScript函数的apply方法与call方法
Sep 25 Javascript
jQuery 插件开发指南
Nov 14 Javascript
详解Angularjs 如何自定义Img的ng-load 事件
Feb 15 Javascript
原生js实现密码输入框值的显示隐藏
Jul 17 Javascript
利用ES6实现单例模式及其应用详解
Dec 09 Javascript
浅谈mvvm-simple双向绑定简单实现
Apr 18 Javascript
js控制随机数生成概率代码实例
Mar 21 Javascript
js实现web调用摄像头 js截取视频画面
Apr 21 Javascript
JS回调函数原理与用法详解【附PHP回调函数】
Jul 20 Javascript
js常用方法、检查是否有特殊字符串、倒序截取字符串操作完整示例
Jan 26 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
rephactor 优秀的PHP的重构工具
2011/06/09 PHP
在laravel中使用Symfony的Crawler组件分析HTML
2017/06/19 PHP
php查询内存信息操作示例
2019/05/09 PHP
理解JavaScript中的事件
2006/09/23 Javascript
查看图片(前进后退)功能实现js代码
2013/04/24 Javascript
中止javascript执行的方法
2014/02/14 Javascript
jQuery实现鼠标经过图片预览大图效果
2014/04/10 Javascript
JavaScript的jQuery库插件的简要开发指南
2015/08/12 Javascript
request请求获取参数的实现方法(post和get两种方式)
2016/09/27 Javascript
JavaScript 网页中实现一个计算当年还剩多少时间的倒数计时程序
2017/01/25 Javascript
纯JS实现轮播图
2017/02/22 Javascript
jQuery插件echarts设置折线图中折线线条颜色和折线点颜色的方法
2017/03/03 Javascript
vue插件vue-resource的使用笔记(小结)
2017/08/04 Javascript
浅谈如何使用 webpack 优化资源
2017/10/20 Javascript
React如何避免重渲染
2018/04/10 Javascript
Angular使用动态加载组件方法实现Dialog的示例
2018/05/11 Javascript
js实现简单分页导航栏效果
2019/06/28 Javascript
[01:10:49]Secret vs VGJ.S 2018国际邀请赛淘汰赛BO3 第二场 8.24
2018/08/25 DOTA
python实现简单聊天应用 python群聊和点对点均实现
2017/09/14 Python
python解决pandas处理缺失值为空字符串的问题
2018/04/08 Python
Python解决走迷宫问题算法示例
2018/07/27 Python
Django框架模板注入操作示例【变量传递到模板】
2018/12/19 Python
在tensorflow以及keras安装目录查询操作(windows下)
2020/06/19 Python
Python 列表推导式需要注意的地方
2020/10/23 Python
巧用HTML5给按钮背景设计不同的动画简单实例
2016/08/09 HTML / CSS
Canvas绘制浮动球效果的示例
2017/12/29 HTML / CSS
阿里健康官方海外旗舰店:阿里健康国际自营
2017/11/24 全球购物
新西兰便宜隐形眼镜购买网站:QUICKLENS New Zealand
2019/03/02 全球购物
.net面试题
2015/12/22 面试题
工商管理专业实习生自我鉴定
2013/09/29 职场文书
运动会入场解说词300字
2014/01/25 职场文书
中餐厅主管的职责范文
2014/02/04 职场文书
安全生产大检查方案
2014/05/07 职场文书
2014年教师学期工作总结
2014/11/08 职场文书
小升初自荐信范文
2015/03/05 职场文书
优秀教师主要事迹材料
2015/11/04 职场文书