【写一个自己的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,适合大 ...
随机推荐
- grep搜索当前目录和递归搜索子目录中文本文件的特定pattern
一般在windows上文本编辑器notepad++,UE这些都有这些功能,Linux下就换了一种方式,用grep来完成文件中信息查找的方式. grep -R -n --include="*. ...
- xargs mv命令使用方法:ls *.mp3 |xargs -i mv {} /tmp
ls *.mp3 |xargs -i mv {} /tmp 或者 find . -name "*.mp3" -exec mv {} /tmp \;
- jQuery UI 之 EasyUI 快速入门
jQuery EasyUI 基础 转载自(http://www.shouce.ren/api/view/a/3350) jQuery EasyUI 是一个基于 jQuery 的框架,集成了各种用户界面 ...
- 【剑指offer】面试题22:栈的压入、弹出序列
题目: 输入两个整数序列,第一个序列表示栈的压入顺序,请判断第二个序列是否为该栈的弹出顺序.假设压入栈的所有数字均不相等.例如序列1,2,3,4,5是某栈的压入顺序,序列4,5,3,2,1是该压栈序列 ...
- poj1724
ROADS Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 10804 Accepted: 3976 Descriptio ...
- 表格td标签在不添加多余标签的情况下实现文本内容单行显示,多余部分省略号表示的方法
#table { table-layout: fixed; } .content { white-space: nowrap; text-overflow: ellipsis; -o-text-ove ...
- 使用ASIHttoRequest需要导入的framework
需要导入如下framework libxml2.2.dylib libz.1.2.5.dylib MobileCoreServices.framework SystemConfiguration.fr ...
- FCKeditor
FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器.它志于轻量化,不需要太复杂的安装步骤即可使用. 它可和PHP.JavaScript.ASP.ASP.NET.Col ...
- 百度Echarts使用心得
echarts官网:http://echarts.baidu.com/index.html 最近用了echart,有一下问题需要注意: 1.echarts的使用实例 代码:从地图中取得whitejso ...
- js 的try catch
语法: try { //在此运行代码 } catch(err) { //在此处理错误 } 注意:try...catch 使用小写字母.大写字母会出错. <script language=&quo ...