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 相关文章推荐
JavaScript 动态创建VML的方法
Oct 14 Javascript
jquery 表单取值常用代码
Dec 22 Javascript
关于跨站脚本攻击问题
Dec 22 Javascript
javascript设置页面背景色及背景图片的方法
Dec 29 Javascript
BootStrap实现轮播图效果(收藏)
Dec 30 Javascript
如何提高Dom访问速度
Jan 05 Javascript
Canvas实现动态的雪花效果
Feb 13 Javascript
JavaScript文本特效实例小结【3个示例】
Dec 22 Javascript
vue el-table实现行内编辑功能
Dec 11 Javascript
HTML+JS实现“代码雨”效果源码(黑客帝国文字下落效果)
Mar 17 Javascript
JS表单验证插件之数据与逻辑分离操作实例分析【策略模式】
May 01 Javascript
vue实现移动端div拖动效果
Mar 03 Vue.js
$.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
把1316这个数表示成两个数的和,其中一个为13的倍数,另一个是11的倍数,求这两个数。
2011/06/24 PHP
php tp验证表单与自动填充函数代码
2012/02/22 PHP
php常用数学函数汇总
2014/11/21 PHP
浅谈php冒泡排序
2014/12/30 PHP
php读取文件内容的方法汇总
2015/01/24 PHP
在Mac上编译安装PHP7的开发环境
2015/07/28 PHP
javascript仿qq界面的折叠菜单实现代码
2012/12/12 Javascript
JavaScript中利用Array和Object实现Map的方法
2015/07/27 Javascript
jQuery xml字符串的解析、读取及查找方法
2016/03/01 Javascript
asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
2016/05/05 Javascript
jquery模拟多级复选框效果的简单实例
2016/06/08 Javascript
js接收并转化Java中的数组对象的方法
2016/08/11 Javascript
Vue.js第三天学习笔记(计算属性computed)
2016/12/01 Javascript
深究AngularJS中ng-drag、ng-drop的用法
2017/06/12 Javascript
Angular使用动态加载组件方法实现Dialog的示例
2018/05/11 Javascript
Vue点击切换颜色的方法
2018/09/13 Javascript
解决angular2在双向数据绑定时[(ngModel)]无法使用的问题
2018/09/13 Javascript
AngularJS 监听变量变化的实现方法
2018/10/09 Javascript
生产制造追溯系统之再说条码打印
2019/06/03 Javascript
[54:19]完美世界DOTA2联赛PWL S2 Magma vs PXG 第二场 11.28
2020/12/01 DOTA
python实现分页效果
2017/10/25 Python
pandas对dataFrame中某一个列的数据进行处理的方法
2019/07/08 Python
python3+selenium获取页面加载的所有静态资源文件链接操作
2020/05/04 Python
浅谈html5 video 移动端填坑记
2018/01/15 HTML / CSS
浅谈amaze-ui中datepicker和datetimepicker注意的几点
2020/08/21 HTML / CSS
KIKO MILANO荷兰网上商店:意大利专业化妆品品牌
2017/05/12 全球购物
亚马逊巴西站:Amazon.com.br
2019/09/22 全球购物
JD Sports荷兰:英国领先的运动时尚零售商
2020/03/13 全球购物
CSS代码检查工具stylelint的使用方法详解
2021/03/27 HTML / CSS
应届生法律顾问求职信
2013/11/19 职场文书
国际贸易专业求职信
2014/06/04 职场文书
土地租赁意向书
2014/07/30 职场文书
涨价通知怎么写
2015/04/23 职场文书
活动简报范文
2015/07/22 职场文书
保安辞职申请书应该怎么写?
2019/07/15 职场文书
如何自己动手写SQL执行引擎
2021/06/02 MySQL