JavaScript获取事件对象和目标对象】的更多相关文章

在JavaScript开发中,经常需要获取触发某个事件的目标对象.让后根据目标对象进行不同的业务处理.下面展示通过JavaScript获取触发事件的事件目标对象.如下: Js代码 1 2 3 4 5 6 7 8 9 10 window.onload = function(){     var obj = document.getElementById("test");         obj.onclick = function(event){       // W3C的event对象…
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 绑定事件的两种方式 我们在上一篇文章中已经讲过事件的概念.这里讲一下注册事件的两种方式,我们以onclick事件为例. 方式一:onclick 举例: <body> <button>点我</button> <script> var btn = document.getElementsByTagName("button&qu…
原文地址:http://jingyan.baidu.com/article/d8072ac4594d6cec95cefdac.html 事件对象 的获取很简单,很久前我们就知道IE中事件对象是作为全局对象( window.event )存在的,Firefox中则是做为句柄( handler )的第一个参数传入内的.所以一行代码就可以搞定 代码如下: var evt = window.event || arguments[0]; 下面分三种添加事件的方式讨论,你也许会看到以前没有看到过的获取方式.…
javascript获取json对象的key名称的两种方法 数据处理中,你可能接收到一个不确定内容格式的json对象,然后要把key的值提取出来.今天试过两种可以提取json key的方法,均可以正常工作. 先看第一种方法 jsonObj = { Name: 'richard', Value: '8' }for (key in jsonObj){ console.log(key); //add your statement to get key value} 结果 NameValue 第二种方法…
js的事件,如点击事件,可以直接用this获取事件对象,而jQuery可以使用$(this)来获取事件对象.vue必须借助事件的 event 对象 的 currentTarget 才能获取事件对象 v-on:click="onClick( $event)" onClick(e){ //jquery $(e.currentTarget) console.log(e) // e.target 是你当前点击的元素 // e.currentTarget 是你绑定事件的元素 #获得点击元素的前一…
在javascript开发中我们会经常获取页面中的事件对象,然后来处理这些事件,例如下面的getEvent函数就是获取javascript下的页面事件对象. function getEvent(event){ return event || window.event; } 我们使用getEvent的时候可以这样调用.   并且把foo函数绑定到一个onclick事件上. 但是常用的是foo函数不会有参数,或者第一个参数没有传入,我们可以通过arguments[0]来获取第一个参数. 在IE中ev…
事件源对象是指event对象,其封装了与事件相关的详细信息,比如按键状态. 获取事件源对象的方法 <!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">…
鼠标操作导致的事件对象中的特殊属性和方法 鼠标事件是 Web 上面最常用的一类事件,毕竟鼠标还是最主要的定位设备.那么通过事件对象可以获取到鼠标按钮信息和屏幕坐标获取等 鼠标按钮 只有在主鼠标按钮被单击时(常规一般是鼠标左键)才会触发 click 事件,因此检测按钮的信息并不是必要的 但对于 mousedown 和 mouseup 事件来说,则在其 event 对象存在一个 button 属性,表示按下或释放按钮 <script type="text/javascript">…
Event 对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 事件通常与函数结合使用,函数不会在事件发生前被执行! 本文用于记录个人学习过程中的两个小练习,其中包括事件对象的一些用法和问题的解决以及兼容性问题 获取鼠标指针坐标 div跟随鼠标移动 练习 1 获取鼠标指针坐标 两个div,当鼠标在上面的div#areaDiv移动时,在下面的div#showMsg中显示鼠标指针坐标 <!DOCTYPE html> <html>…
事件对象——兼容处理 /* * 功能: 事件对象兼容 * 参数: 表示常规浏览器的事件对象e */ function getEvent(e) { // 如果存在e存在,直接返回,否则返回window.event 7 return e || window.event; 8 } 获取事件所对应的目标——兼容处理 /* * 功能: 获取事件所对应的目标 * 参数: 表示常规浏览器的事件对象e */ function getTargetByEvent(e) { // 如果存在e.target,直接返回,…