【写一个自己的js库】 4.完善跨浏览器事件操作
1.阻止冒泡。
function stopPropagation(event){
event = event || getEvent(event);
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble = true;
}
}
Lily['event'] = stopPropagation;
2.阻止事件默认动作。
function preventDefault(event){
event = event || getEvent(event);
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue = false;
}
}
Lily['preventDefault'] = preventDefault;
3.在文档加载完时执行函数,不用等待图片都加载完。
function addLoadEvent(loadEvent, waitForImages){
if(!isCompatible()) return false;
if(waitForImages){
addEvent(window, 'load', loadEvent);
}
var init = function (){
if(arguments.callee.done) return;
arguments.callee.done = true;
loadEvent.apply(document, arguments);
};
if(document.addEventListener){
document.addEventListener("DomContentLoaded", init, false);
}
if(/WebKit/i.test(navigator.userAgent)){
var timer = setInterval(function (){
if(/complete|loaded/.test(document.readyState)){
clearInteval(timer);
init();
}
}, 10);
}
/*@cc_on @*/
/*@if (@_win32)
document.write("<src id=__ie_loaded defer src=//:><\/script>");
var script = document.getElementById("__ie_loaded");
script.onreadystatechange = function (){
if(this.readyState == "complete"){
this.onreadystatechange = null;
init();
}
};
/*@end @*/
return true;
}
Lily['addLoadEvent'] = addLoadEvent;
4.取得target对象。
function getTarget(event){
event = event || getEvent(event);
var target = event.target || event.srcElement;
if(target.nodeType == Lily.node.TEXT_NODE){
target = target.parentNode;
}
return target;
}
Lily['getTarget'] = getTarget;
5.判断鼠标哪个键被按下。
function getMouseButton(event){
event = event || getEvent(event);
var buttons = {
'left' : false,
'middle' : false,
'right' : false
};
if(event.toString && event.toString().indexOf('MouseEvent') != -1){
switch(event.button){
case 0:
buttons.left = true;
break;
case 1:
buttons.middle = true;
break;
case 2:
buttons.right = true;
break;
default:
break;
}
}else if(event.button){
switch(event.button){
case 1:
buttons.left = true;
break;
case 2:
buttons.right = true;
break;
case 3:
buttons.left = true;
buttons.right = true;
break;
case 4:
buttons.middle = true;
break;
case 5:
buttons.left = true;
buttons.middle = true;
break;
case 6:
buttons.middle = true;
buttons.right = true;
break;
case 7:
buttons.left = true;
buttons.middle = true;
buttons.right = true;
break;
default:
break;
}
}else{
return false;
}
return buttons;
}
Lily['getMouseButton'] = getMouseButton;
6.获取鼠标在文档中的位置。
function getPositionInDocument(event){
event = event || getEvent(event);
var x = event.pageX ||
(event.clientX + document.documentElement.scrollLeft) ||
(event.clientX + document.body.scrollLeft);
var y = event.pageY ||
(event.clientY + document.documentElement.scrollTop) ||
(event.clientY + document.body.scrollTop);
return {'x' : x, 'y' : y};
}
Lily['getPositionInDocument'] = getPositionInDocument;
7.获取按键的值。
function getKeyPressed(event){
event = event || getEvent(event);
var code = event.keyCode;
var value = String.fromCharCode(code);
return {'code': code, 'value': value};
}
Lily['getKeyPressed'] = getKeyPressed;
【写一个自己的js库】 4.完善跨浏览器事件操作的更多相关文章
- 【写一个自己的js库】 1.搭个架子先
最近在看<javascript dom 高级程序设计>,想着跟着里面的代码敲一遍吧,也算是做一下学习笔记吧,所以这不是重新发明轮子,只是个学习的过程. 1.先确定自己的命名空间,并且加入几 ...
- 【写一个自己的js库】 2.实现自己的调试日志
还是本着学习的目的,实现一个自己的调试日志,界面很简单,就是将调试信息显示在页面的正中央,用一个ul包裹,每条信息就是一个li. 1.新建一个myLogger.js文件,将需要的方法声明一下.其中va ...
- 【写一个自己的js库】 5.添加修改样式的方法
1.根据id或class或tag修改样式,样式名是-连接格式的. function setStyleById(elem, styles){ if(!(elem = $(elem)) return fa ...
- 【写一个自己的js库】 3.添加几个处理字符串的方法
1.生成重复的字符串 if(!String.repeat){ String.prototype.repeat = function (count){ return new Array(count + ...
- 【前端】跨浏览器事件处理程序EventUtil.js个人注释及详解
<javascript高级程序设计>跨浏览器事件处理程序EventUtil.js个人注释 EventUtil.js // 跨浏览器事件处理程序封装 var EventUtil = { // ...
- 仿照jquery封装一个自己的js库(二)
本篇为完结篇.主要讲述如何造出轮子的高级特性. 一. css方法的高级操作 先看本文第一部分所讲的dQuery css方法 //css方法 dQuery.prototype.css=function( ...
- 仿照jquery封装一个自己的js库(一)
所谓造轮子的好处就是复习知识点,加深对原版jquery的理解. 本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包 ...
- 仿照jquery封装一个自己的js库
所谓造轮子的好处就是复习知识点,加深对原版jquery的理解.本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包括 ...
- 自己动手写一个iOS 网络请求库的三部曲[转]
代码示例:https://github.com/johnlui/Swift-On-iOS/blob/master/BuildYourHTTPRequestLibrary 开源项目:Pitaya,适合大 ...
随机推荐
- ubuntu安装配置gradle
在Ubuntu安装Gradle也是很简单.切记请勿使用apt-get安装Gradle.因为Ubuntu源的Gradle实在太旧.安装好基本不能用. 下面是安装步骤: 1.在官网下载最新的Gradle版 ...
- java通过jdbc连接mysql数据库
下载mysql驱动包: http://dev.mysql.com/downloads/file.php?id=456317 解压之后里面有个mysql-connector-java-5.1.35-bi ...
- 编程修养-C语言篇(二)
1.版权和版本——————— 好的程序员会给自己的每个函数,每个文件,都注上版权和版本. 对于C/C++的文件,文件头应该有类似这样的注释: /*************************** ...
- Typecho 代码阅读笔记(一) - 页面渲染及路由机制
转载请注明出处:http://blog.csdn.net/jh_zzz 从 index.php 开始看, /** 初始化组件 */ Typecho_Widget:: widget('Widget_In ...
- centos 6.5 安装 nginx+php+mysql
一.准备工作 (1)配置防火墙 1.首先检查iptables服务的状态 [root@woxplife ~]# service iptables status iptables: Firewall is ...
- android导航设计
http://www.geekpark.net/read/view/199244 Android 应用中十大导航设计错误 http://mobile.51cto.com/design-432944.h ...
- Keil UV4 BUG(带字库液晶不能显示“数、正、过”问题的请看)
Keil UV3一直存在汉字显示(0xFD)的bug,以前在用到带字库的12864液晶的时候,“数”字总是不能正常显示,后来有网友告诉我这是keil的bug,解决掉了.后来keil升级了,我也换了新版 ...
- 转:基础总结篇之一:Activity生命周期
熟悉javaEE的朋友们都了解servlet技术,我们想要实现一个自己的servlet,需要继承相应的基类,重写它的方法,这些方法会在合适的时间被servlet容器调用.其实android中的Acti ...
- EXT JS 4.3 在线学习
官网地址:http://docs.sencha.com/extjs/4.1.3/ 相关示例:http://docs.sencha.com/extjs/4.1.3/#!/example Examples ...
- pythonBasic
1,judgment in deciding(if...:,if..else:,if else...else:),loop(for...:,while True...:) break,continu ...