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 相关文章推荐
在 IE 中调用 javascript 打开 Excel 表
Dec 21 Javascript
JavaScript中常见陷阱小结
Apr 27 Javascript
JavaScript 用Node.js写Shell脚本[译]
Sep 20 Javascript
js解析xml字符串和xml文档实现原理及代码(针对ie与火狐)
Feb 02 Javascript
js confirm()方法的使用方法实例
Jul 13 Javascript
jquery控制display属性为none或block
Mar 31 Javascript
javascript特效实现——当前时间和倒计时效果的简单实例
Jul 20 Javascript
深入浅析JS是按值传递还是按引用传递(推荐)
Sep 18 Javascript
jQuery 如何实现一个滑动按钮开关
Dec 01 Javascript
js数字计算 误差问题的快速解决方法
Feb 28 Javascript
关于layui导航栏不展示下拉列表的解决方法
Sep 25 Javascript
vue中的循环对象属性和属性值用法
Sep 04 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
WINDOWS下php5.2.4+mysql6.0+apache2.2.4+ZendOptimizer-3.3.0配置
2008/03/28 PHP
php下把数组保存为文件格式的实例应用
2010/02/08 PHP
php将gd生成的图片缓存到memcache的小例子
2013/06/05 PHP
javascript 常用代码技巧大收集
2009/02/25 Javascript
javascript 简练的几个函数
2009/08/29 Javascript
js null undefined 空区别说明
2010/06/13 Javascript
js获取select标签选中值的两种方式
2014/01/09 Javascript
给js文件传参数(详解)
2014/07/13 Javascript
JavaScript中的alert()函数使用技巧详解
2014/12/29 Javascript
利用jquery实现瀑布流3种案例
2016/09/18 Javascript
TypeScript学习之强制类型的转换
2016/12/27 Javascript
JS实现的样式切换功能tableCSS实例
2016/12/30 Javascript
详解JS实现系统登录页的登录和验证
2019/04/29 Javascript
解决Layui数据表格的宽高问题
2019/09/28 Javascript
Vue+Node服务器查询Mongo数据库及页面数据传递操作实例分析
2019/12/20 Javascript
vue组件创建的三种方式小结
2020/02/03 Javascript
Python使用正则匹配实现抓图代码分享
2015/04/02 Python
解析Python中的变量、引用、拷贝和作用域的问题
2015/04/07 Python
在Python的Django框架中实现Hacker News的一些功能
2015/04/17 Python
Python 实现 贪吃蛇大作战 代码分享
2016/09/07 Python
CentOS6.5设置Django开发环境
2016/10/13 Python
python django 增删改查操作 数据库Mysql
2017/07/27 Python
在PyCharm下打包*.py程序成.exe的方法
2018/11/29 Python
python多线程实现TCP服务端
2019/09/03 Python
python日志模块logbook使用方法
2019/09/19 Python
解决tensorflow训练时内存持续增加并占满的问题
2020/01/19 Python
基于python 等频分箱qcut问题的解决
2020/03/03 Python
Python生成器常见问题及解决方案
2020/03/21 Python
纯CSS3打造属于自己的“小黄人”
2016/03/14 HTML / CSS
Java语言的优势
2015/01/10 面试题
幼儿园教师请假制度
2014/01/16 职场文书
关于教师节的演讲稿
2014/09/04 职场文书
Vue接口封装的完整步骤记录
2021/05/14 Vue.js
Linux系统下MySQL配置主从分离的步骤
2022/03/21 MySQL
MYSQL常用函数介绍
2022/05/05 MySQL
vue实现登陆页面开发实践
2022/05/30 Vue.js