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 相关文章推荐
jquery 中多条件选择器,相对选择器,层次选择器的区别
Jul 03 Javascript
JavaScript实现拼音排序的方法
Nov 20 Javascript
鼠标经过tr时,改变tr当前背景颜色
Jan 13 Javascript
JS实现仿QQ聊天窗口抖动特效
May 10 Javascript
AngularJS打开页面隐藏显示表达式用法示例
Dec 25 Javascript
利用C/C++编写node.js原生模块的方法教程
Jul 07 Javascript
Vue项目中quill-editor带样式编辑器的使用方法
Aug 08 Javascript
mui 打开新窗口的方式总结及注意事项
Aug 20 Javascript
js截取字符串功能的实现方法
Sep 27 Javascript
js+HTML5 canvas 实现简单的加载条(进度条)功能示例
Jul 16 Javascript
Centos7 安装Node.js10以上版本的方法步骤
Oct 15 Javascript
在vue中封装的弹窗组件使用队列模式实现方法
Jul 23 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
自己动手,丰衣足食 - 短波框形天线制作
2021/03/01 无线电
php入门学习知识点五 关于php数组的几个基本操作
2011/07/14 PHP
php实现天干地支计算器示例
2014/03/14 PHP
PHP使用内置dir类实现目录遍历删除
2015/03/31 PHP
PHP实现QQ快速登录的方法
2016/09/28 PHP
php基于Redis消息队列实现的消息推送的方法
2018/11/28 PHP
Laravel5.5+ 使用API Resources快速输出自定义JSON方法详解
2020/04/06 PHP
学习ExtJS Panel常用方法
2009/10/07 Javascript
JS实现淘宝支付宝网站的控制台菜单效果
2015/09/28 Javascript
jQuery实现的精美平滑二级下拉菜单效果代码
2016/03/28 Javascript
JavaScript操作表单实例讲解(上)
2016/06/20 Javascript
一个可复用的vue分页组件
2017/05/15 Javascript
代码详解Vuejs响应式原理
2017/12/20 Javascript
vue动态绑定class的几种常用方式小结
2019/05/21 Javascript
vue spa应用中的路由缓存问题与解决方案
2019/05/31 Javascript
刷新页面后让控制台的js代码继续执行
2019/09/20 Javascript
jquery制作的移动端购物车效果完整示例
2020/02/24 jQuery
[01:05:40]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS DT第三场
2014/05/24 DOTA
Python实现股市信息下载的方法
2015/06/15 Python
深入浅析Python的类
2018/06/22 Python
python消除序列的重复值并保持顺序不变的实例
2018/11/08 Python
python opencv鼠标事件实现画框圈定目标获取坐标信息
2020/04/18 Python
解决django-xadmin列表页filter关联对象搜索问题
2019/11/15 Python
细数nn.BCELoss与nn.CrossEntropyLoss的区别
2020/02/29 Python
美国最大的珠宝商之一:Littman Jewelers
2016/11/13 全球购物
Oracle的内存结构(Memory structures)
2015/06/10 面试题
一道Delphi上机题
2012/06/04 面试题
电子商务个人自荐信
2013/12/12 职场文书
采购部部门职责
2013/12/15 职场文书
会走路的树教学反思
2014/02/20 职场文书
2015年中学元旦晚会活动方案
2014/12/09 职场文书
2015年五一劳动节演讲稿
2015/03/18 职场文书
美术教师求职信范文
2015/03/20 职场文书
务工证明怎么写
2015/06/18 职场文书
导游词之青城山景区
2019/09/27 职场文书
Python使用DFA算法过滤内容敏感词
2022/04/22 Python