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 相关文章推荐
csdn 论坛技术区平均给分功能
Nov 07 Javascript
jquery 使用点滴函数代码
May 20 Javascript
基于jquery中children()与find()的区别介绍
Apr 26 Javascript
JavaScript实现的一个日期格式化函数分享
Dec 06 Javascript
jquery实现点击向下展开菜单项(伸缩导航)效果
Aug 22 Javascript
D3.js实现柱状图的方法详解
Sep 21 Javascript
Bootstrap Table的使用总结
Oct 08 Javascript
angular-cli修改端口号【angular2】
Apr 19 Javascript
微信小程序开发之toast等弹框提示使用教程
Jun 08 Javascript
在vue中使用echars实现上浮与下钻效果
Nov 08 Javascript
JS实现网站楼层导航效果代码实例
Jun 16 Javascript
创建与框架无关的JavaScript插件
Dec 01 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
无数据库的详细域名查询程序PHP版(2)
2006/10/09 PHP
有关php运算符的知识大全
2011/11/03 PHP
PHP+Apache+Mysql环境搭建教程
2016/08/01 PHP
php工具型代码之印章抠图
2018/07/18 PHP
详解PHP多个进程配合redis的有序集合实现大文件去重
2019/03/06 PHP
jquery 输入框数字限制插件
2009/11/10 Javascript
ExtJS 2.0 GridPanel基本表格简明教程
2010/05/25 Javascript
jQuery中对未来的元素绑定事件用bind、live or on
2014/04/17 Javascript
jQuery实现友好的轮播图片特效
2015/01/12 Javascript
JS实现的4种数字千位符格式化方法分享
2015/03/02 Javascript
SuperSlide标签切换、焦点图多种组合插件
2015/03/14 Javascript
JS提交form表单实例分析
2015/12/10 Javascript
JavaScript实现前端分页控件
2017/04/19 Javascript
详解webpack-dev-server使用http-proxy解决跨域问题
2018/01/13 Javascript
Vue2 轮播图slide组件实例代码
2018/05/31 Javascript
electron实现静默打印的示例代码
2019/08/12 Javascript
微信小程序点击生成朋友圈分享图(遇到的坑)
2020/06/17 Javascript
vuex实现购物车的增加减少移除
2020/06/28 Javascript
JS hasOwnProperty()方法检测一个属性是否是对象的自有属性的方法
2021/01/29 Javascript
[01:31]DOTA2上海特级锦标赛 SECRET战队完整宣传片
2016/03/16 DOTA
[44:15]DOTA2上海特级锦标赛主赛事日 - 5 败者组决赛Liquid VS EG第二局
2016/03/06 DOTA
Python实现从url中提取域名的几种方法
2014/09/26 Python
python监控linux内存并写入mongodb(推荐)
2017/09/11 Python
浅谈Python处理PDF的方法
2017/11/10 Python
celery4+django2定时任务的实现代码
2018/12/23 Python
在python中画正态分布图像的实例
2019/07/08 Python
Python简易版停车管理系统
2019/08/12 Python
Tensorflow的常用矩阵生成方式
2020/01/04 Python
使用python实现微信小程序自动签到功能
2020/04/27 Python
使用python脚本自动生成K8S-YAML的方法示例
2020/07/12 Python
分享29个基于Bootstrap的HTML5响应式网页设计模板
2015/11/19 HTML / CSS
关于圣诞节的广播稿
2014/01/26 职场文书
房产继承公证书
2014/04/09 职场文书
领导欢迎词致辞
2015/01/23 职场文书
python运行脚本文件的三种方法实例
2022/06/25 Python
postgresql之greenplum字符串去重拼接方式
2023/05/08 PostgreSQL