JS——event
触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息:
普通浏览器支持 event(传参),IE678支持 window.event(无参),兼容写法:
<script>
var divEle = document.getElementsByTagName("div")[0];
divEle.onclick = function (e) {
e = e || window.event;
console.log(e);
}
</script>
client、page、screen三者之间的区别:
clientX/clientY:当前窗口(可视区域)的左上角为基准点 pageX/pageY:在不拖动情况下同上,在拖动的情况下,会越来越大 screenX/screenY:当前屏幕左上角为基准点
pageX、pageY在IE678中不支持,兼容写法:被卷去的部分+可视区域坐标
<script>
document.onclick = function (e) {
e = e || window.event;
var pageY = e.pageY || scroll().top + e.clientY;
console.log(pageY);
} function scroll() {
return {
"top": window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop,
"left": window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft
};
}
</script>
特别补充:offsetX/offsetY,以触发事件的元素左上角为基准点
<script>
var divEle = document.getElementsByTagName("div")[0];
divEle.onclick = function (e) {
e = e || window.event;
console.log(e.offsetY);
}
</script>
JS——event的更多相关文章
- js event 2
js event 2 浏览器兼容 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...
- js event 事件兼容浏览器 ie不需要 event参数 firefox 需要
js event 事件兼容浏览器 ie不需要 event参数 firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...
- Node.js Event Loop 的理解 Timers,process.nextTick()
写这篇文章的目的是将自己对该文章的理解做一个记录,官方文档链接The Node.js Event Loop, Timers, and process.nextTick() 文章内容可能有错误理解的地方 ...
- JS Event 鼠标拖拽事件
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> ...
- The Node.js Event Loop, Timers, and process.nextTick() Node.js事件循环,定时器和process.nextTick()
个人翻译 原文:https://nodejs.org/en/docs/guides/event-loop-timers-and-nexttick/ The Node.js Event Loop, Ti ...
- Node.js event loop 和 JS 浏览器环境下的事件循环的区别
Node.js event loop 和 JS 浏览器环境下的事件循环的区别: 1.线程与进程: JS 是单线程执行的,指的是一个进程里只有一个主线程,那到底什么是线程?什么是进程? 进程是 CPU ...
- The Node.js Event Loop, Timers, and process.nextTick()
The Node.js Event Loop, Timers, and process.nextTick() | Node.js https://nodejs.org/uk/docs/guides/e ...
- js & Event Bus
js & Event Bus global event handler (broadcast / trigger / emit / listen ) // 实现一个 EventBus类,这个类 ...
- [译]Node.js - Event Loop
介绍 在读这篇博客之前,我强列建议先阅读我的前两篇文章: Getting Started With Node.js Node.js - Modules 在这篇文章中,我们将学习 Node.js 中的事 ...
- JS Event事件流(冒泡机制、捕获机制、事件绑定)
1.事件流 事件流:从页面中接收事件的顺序.也就是说当一个事件产生时,这个事件的传播过程,就是事件流. IE的事件流 IE中的事件流叫事件冒泡:事件冒泡:事件开始时由最具体的元素接收,然后逐级向上传播 ...
随机推荐
- jQuery WeUI 组件下拉刷新和滚动加载的实现
最近在做手机版使用到了下拉刷新和滚动加载,记录一下实现过程: 一.引入文件 ? 1 2 3 4 <link rel="stylesheet" href="Conte ...
- C# 解决EXCEL单元格合并,行高无法自适应问题
解决方法:根据单元格内容长度,设置单元格所在行的行高 public static float getExcelCellAutoHeight(string strtest, float fontCoun ...
- kendo Cannot read property 'call' of undefined
造成这个错误的原因是在 必须有id的定义
- 夜话JAVA设计模式之单例模式(单件模式Singleton)
单例模式也叫单件模式,就是确保一个类只有一个实例,并提供一个全局访问点. 设计成单例即把某个类设计成我们自己管理的单独实例,避免实例对象的重复创建,我们只有通过单例类的全局访问点获取实例. 下面来看金 ...
- Windows Server下把BAT批处理注册成服务在后台运行且注销后能正常运行
批处理有如下特点: 1.登录到当前窗口运行时,如果关闭控制台会连同启动的程序一起关闭. 2.如果是以start /b的形式启动,那么同样也是在控制台关闭后者注销当前窗口也会一起关闭. 3.如果以vbs ...
- java的异常(Exception)信息的详细记录
下面的三个方法都是获取异常的详细信息,或许的异常详细信息以字符串的形式返回,保持栈堆载的风格 方法一: public static String getExceptionAllinformation( ...
- 创建.m文件一片空白的错误解决方式
今天写代码,想继承一个类,突然发现创建的类文件一片空白,如图 之后各种调试发现都解决不了问题,以为是装了xcode6 beta2 版本号的问题,结果发现事实上是我创建错了 我创建的是 watermar ...
- Android推断屏幕锁屏的方法总结
转载请注明:http://blog.csdn.net/heroxuetao/article/details/24639203 因为做一个项目,须要推断屏幕是否锁屏,发现网上方法非常多.可是比較杂.如今 ...
- Android利用Volley异步载入数据完整具体演示样例(二)
MainActivity例如以下: package cc.y; import android.app.Activity; import android.content.Context; import ...
- Codeforces Round #263 (Div. 1)-A,B,C
A: 这道题目还是非常easy的,做过非常多遍了.相似于分割木板的问题. 把全部的数放在一个优先队列里,弹出两个最大的,然后合并,把结果放进去.依次进行. #include <iostream& ...