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 相关文章推荐
jQuery中:empty选择器用法实例
Dec 30 Javascript
javascript下拉框选项单击事件的例子分享
Mar 04 Javascript
jquery带动画效果幻灯片特效代码
Aug 27 Javascript
借助FileReader实现将文件编码为Base64后通过AJAX上传
Dec 24 Javascript
jQuery中checkbox反复调用attr('checked', true/false)只有第一次生效的解决方法
Nov 16 Javascript
微信小程序实战之仿android fragment可滑动底部导航栏(4)
Apr 16 Javascript
js排序与重组的实例讲解
Aug 28 Javascript
解决vue中虚拟dom,无法实时更新的问题
Sep 15 Javascript
微信小程序生成海报分享朋友圈的实现方法
May 06 Javascript
解决使用layui对select append元素无效或者未及时更新的问题
Sep 18 Javascript
微信小程序webSocket的使用方法
Feb 20 Javascript
vue使用axios实现excel文件下载的功能
Jul 16 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
Mysql的GROUP_CONCAT()函数使用方法
2008/03/28 PHP
PHP调用JAVA的WebService简单实例
2014/03/11 PHP
分享PHP计算两个日期相差天数的代码
2015/12/23 PHP
javascript打开新窗口同时关闭旧窗口
2009/01/16 Javascript
原生js ActiveXObject获取execl里面的值
2013/11/01 Javascript
jquery统计输入文字的个数并对其进行判断
2014/01/07 Javascript
Javascript Object 对象学习笔记
2014/12/17 Javascript
Jquery动态添加输入框的方法
2015/05/29 Javascript
基于Jquery代码实现支持PC端手机端幻灯片代码
2015/11/17 Javascript
BootStrap glyphicons 字体图标实现方法
2016/05/01 Javascript
jQuery获取浏览器类型和版本号的方法
2016/07/05 Javascript
jquery 判断selection range 是否在容器中的简单实例
2016/08/02 Javascript
JavaScript中 this 指向问题深度解析
2017/02/21 Javascript
微信小程序开发animation心跳动画效果
2017/08/16 Javascript
详解Vue.js Mixins 混入使用
2017/09/15 Javascript
Vue兼容ie9的问题全面解决方案
2018/06/19 Javascript
JS的Ajax与后端交互数据的实例
2018/08/08 Javascript
详解VUE项目中安装和使用vant组件
2019/04/28 Javascript
如何换个角度使用VUE过滤器详解
2019/09/11 Javascript
微信小程序实现二维码签到考勤系统
2020/01/16 Javascript
[01:02:53]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第二局
2016/03/06 DOTA
Python中函数参数调用方式分析
2018/08/09 Python
python实现连续图文识别
2018/12/18 Python
pytorch中如何使用DataLoader对数据集进行批处理的方法
2019/08/06 Python
Django静态资源部署404问题解决方案
2020/05/11 Python
英国护肤品购物网站:Beauty Expert
2016/08/19 全球购物
英国花园家具中心:Garden Furniture Centre
2017/08/24 全球购物
意大利在线高尔夫商店:Online Golf
2021/03/09 全球购物
如何设置Java的运行环境
2013/04/05 面试题
护理个人求职信范文
2014/01/08 职场文书
采购部部长岗位职责
2014/02/06 职场文书
电子工程求职信
2014/07/17 职场文书
优秀班主任事迹材料
2014/12/16 职场文书
2015年七年级班主任工作总结
2015/05/21 职场文书
如何使用Python实现一个简易的ORM模型
2021/05/12 Python
Linux安装apache服务器的配置过程
2021/11/27 Servers