js模仿jquery的写法示例代码_javascript技巧
程序员文章站
2022-03-21 23:06:02
...
测试代码:
(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;
}
复制代码 代码如下:
(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简写常用的12个技巧(可以大大减少你的js代码量)
-
Ajax (Asynchronous javascript xml) 搜索框核心代码(JQuery) Ajax判断用户名存在核心代码 附:原生js的Ajax代
-
JavaScript开发中利用jQuery将多条数据插入模态框的示例代码
-
让textarea自动调整大小的js代码_javascript技巧
-
从盛大通行证上摘下来的身份证验证js代码_javascript技巧
-
基于jquery的高性能td和input切换并可修改内容实现代码_javascript技巧
-
js 代码集(学习js的朋友可以看下)_javascript技巧
-
IE6中使用position导致页面变形的解决方案(js代码)_javascript技巧
-
JavaScript限定复选框的选择个数示例代码_javascript技巧
-
js取消单选按钮选中示例代码_javascript技巧