js模仿jquery的写法示例代码


Posted in Javascript onJune 16, 2013

测试代码:

(function(){ 
var p=new PEvent(document); 
p.click(function() { 
//alert("单击"); 
//alert(p.style); 
var html=""; 
for ( var item in document) { 
html+=item+':'+document[item]+"\r\n"; 
} 
//alert(html); 
}); 
p.dblclick(function() { 
alert("双击"); 
}); 
p.contextmenu(function(event) { 
try{ 
var x=event.clientX; 
var y=event.clientY; 
var menu=g("menu"); //判断坐标 
var width=document.body.clientWidth; 
var height=document.body.clientHeight; 
x=(x+menu.clientWidth)>=width?width-menu.clientWidth:x; 
y=(y+menu.clientHeight)>=height?height-menu.clientHeight:y; 
//alert("可视高度:"+height+",鼠标高度:"+y); 
menu.style.top=y+"px"; 
menu.style.left=x+"px"; 
menu.style.display="block"; 
}catch(e){ 
alert(e); 
} 
return false; 
}); 
function PEvent(dom){ 
this.x=function() { 
this.style.css=dom.style; 
} 
this.click=function(fn){ 
dom.onclick=fn; 
this.x(); 
} 
this.dblclick=function(fn){ 
dom.ondblclick=fn; 
} 
this.contextmenu=function(fn){ 
dom.oncontextmenu=fn; 
} 
this.style=new Po(); 
}; 
function Po() { 
this.name=new Object(); 
this.id=new Object(); 
this.css=new Object(); 
} 
})(); 
function g(id){ 
return document.getElementById(id); 
}

在jquery中,处理事件的时候,都可以匿名方法来写,例如:
obj.click(function(){ 
alert("hello"); 
});

上诉这种形式。
在方法传递参数的时候,可以传递fun 方法。
调用呢,就可以这样调用:
this.dblclick=function(fn){ 
dom.ondblclick=fn; 
}
Javascript 相关文章推荐
JS维吉尼亚密码算法实现代码
Nov 09 Javascript
JS继承--原型链继承和类式继承
Apr 08 Javascript
通过JavaScript使Div居中并随网页大小改变而改变
Jun 24 Javascript
跟我学习javascript的闭包
Nov 16 Javascript
学习使用AngularJS文件上传控件
Feb 16 Javascript
JavaScript判断页面加载完之后再执行预定函数的技巧
May 17 Javascript
AngularJS服务service用法总结
Dec 13 Javascript
Vue.js实战之利用vue-router实现跳转页面
Apr 01 Javascript
js评分组件使用详解
Jun 06 Javascript
微信浏览器禁止页面下拉查看网址实例详解
Jun 28 Javascript
js实现以最简单的方式将数组元素添加到对象中的方法
Dec 20 Javascript
vue项目打包后提交到git上为什么没有dist这个文件的解决方法
Sep 16 Javascript
$.getJSON在IE下失效的原因分析及解决方法
Jun 16 #Javascript
jsp js鼠标移动到指定区域显示选项卡离开时隐藏示例
Jun 14 #Javascript
JS保存、读取、换行、转Json报错处理方法
Jun 14 #Javascript
用js实现控件的隐藏及style.visibility的使用
Jun 14 #Javascript
JavaScript实现表格排序方法
Jun 14 #Javascript
json数据处理技巧(字段带空格、增加字段、排序等等)
Jun 14 #Javascript
用js实现输入提示(自动完成)的实例代码
Jun 14 #Javascript
You might like
PHP删除数组中指定值的元素常用方法实例分析【4种方法】
2018/08/21 PHP
解决Laravel5.2 Auth认证退出失效的问题
2019/10/14 PHP
Jquery之美中不足小结
2011/02/16 Javascript
ajax 同步请求和异步请求的差异分析
2011/07/04 Javascript
JS自动缩小超出大小的图片
2012/10/12 Javascript
JS中eval函数的使用示例
2013/07/21 Javascript
解决JS中乘法的浮点错误的方法
2014/01/03 Javascript
jquery插件lazyload.js延迟加载图片的使用方法
2014/02/19 Javascript
JavaScript二维数组实现的省市联动菜单
2014/05/08 Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
2016/08/02 Javascript
bootstrap实现图片自动轮播
2016/12/21 Javascript
基于vue.js实现侧边菜单栏
2017/03/20 Javascript
React-Native中禁用Navigator手势返回的示例代码
2017/09/09 Javascript
JavaScript Canvas编写炫彩的网页时钟
2019/10/16 Javascript
详解vue-flickity的fullScreen功能实现
2020/04/07 Javascript
JS变量提升原理与用法实例浅析
2020/05/22 Javascript
解决vuex数据页面刷新后初始化操作
2020/07/26 Javascript
关于vue的列表图片选中打钩操作
2020/09/09 Javascript
vue3中轻松实现switch功能组件的全过程
2021/01/07 Vue.js
python3生成随机数实例
2014/10/20 Python
Python基于identicon库创建类似Github上用的头像功能
2017/09/25 Python
python 定时器,轮询定时器的实例
2019/02/20 Python
Python基础之循环语句用法示例【for、while循环】
2019/03/23 Python
python实现远程控制电脑
2019/05/23 Python
Python 监测文件是否更新的方法
2019/06/10 Python
PyTorch之图像和Tensor填充的实例
2019/08/18 Python
常用python爬虫库介绍与简要说明
2020/01/25 Python
在Python中实现字典反转案例
2020/12/05 Python
用Python实现童年贪吃蛇小游戏功能的实例代码
2020/12/07 Python
使用CSS3的appearance属性改变任何元素的浏览器默认风格
2012/12/24 HTML / CSS
性能测试工程师的面试题
2015/02/20 面试题
优秀村官事迹材料
2014/01/10 职场文书
英文请假条
2014/04/11 职场文书
网吧七夕活动策划方案
2014/08/31 职场文书
2019新员工试用期转正申请书3篇
2019/08/13 职场文书
python入门学习关于for else的特殊特性讲解
2021/11/20 Python