ff下addeventlistener的疑问
代码如下：
<html>
<head>
<title> 鼠标拖曳 </title>
</head>
<body>
<div id= "div1 " style= "position:absolute;width:150px;height:100px;background-color:blue; ">
abcd
</div>
<script language= "javascript ">
var Class = {
create: function () {
return function () {
this.initialize.apply(this, arguments);
};
}
};
var drag = Class.create();
drag.prototype = {
initialize : function() {
var dr = this;
dr.o = null;
},
setObject : function(o) {
var dr = this;
dr.o = o;
dr.bind();
},
bind : function() {
var dr = this;
if (dr.o){
if (dr.o.attachEvent){
dr.o.attachEvent( 'onmousedown ',dr.mousedown);
dr.o.attachEvent( 'onmousemove ',dr.mousemove);
dr.o.attachEvent( 'onmouseout ',dr.mouseout);
dr.o.attachEvent( 'onmouseup ',dr.mouseup);
}
else if (dr.o.addEventListener) {
dr.o.addEventListener( 'mousedown ',dr.mousedown,true);
dr.o.addEventListener( 'mousemove ',dr.mousemove,true);
dr.o.addEventListener( 'mouseup ',dr.mouseup,true);
dr.o.addEventListener( 'mouseout ',dr.mouseout,true);
}
}
},
mousedown : function() {
var dr = this;
dr.b = true;
},
mouseup : function () {
var dr = this;
dr.b = false;
},
mouseout : function () {
var dr = this;
dr.b = false;
},
mousemove : function() {
var e = arguments[0];
var dr = this;
if (dr.b) {//此处 在 mf下 dr.b仍然存在,但到 下面的 dr.o时却是 undefined,ie可正常起作用
dr.o.style.left = e.clientX - dr.o.offsetWidth/2 + 'px ';
dr.o.style.top = e.clientY - dr.o.offsetHeight/2 + 'px ';
}
}
};
var o = document.getElementById( 'div1 ');
var drag = new drag();
drag.setObject(o);
</script>
</body>
</html>
麻烦各位瞧瞧治治。。。
[解决办法]
if (dr.b) {
o.style.left = e.clientX - o.offsetWidth/2 + 'px ';
o.style.top = e.clientY - o.offsetHeight/2 + 'px ';
}
[解决办法]
正确答案是这样，好好去理解一下this.
<html>
<head>
<title> 鼠标拖曳 </title>
</head>
<body>
<div id= "div1 " style= "position:absolute;width:150px;height:100px;background-color:blue; ">
abcd
</div>
<script language= "javascript ">
var Class = {
create: function () {
return function () {
this.initialize.apply(this, arguments);
};
}
};
var drag = Class.create();
drag.prototype = {
initialize : function() {
var dr = this;
dr.o = null;
},
setObject : function(o) {
var dr = this;
dr.o = o;
o.self = this;
dr.bind();
},
bind : function() {
var dr = this;
if (dr.o){
if (dr.o.attachEvent){
dr.o.attachEvent( 'onmousedown ',dr.mousedown);
dr.o.attachEvent( 'onmousemove ',dr.mousemove);
dr.o.attachEvent( 'onmouseout ',dr.mouseout);
dr.o.attachEvent( 'onmouseup ',dr.mouseup);
}
else if (dr.o.addEventListener) {
dr.o.addEventListener( 'mousedown ',dr.mousedown,true);
dr.o.addEventListener( 'mousemove ',dr.mousemove,true);
dr.o.addEventListener( 'mouseup ',dr.mouseup,true);
dr.o.addEventListener( 'mouseout ',dr.mouseout,true);
}
}
},
mousedown : function() {
var dr = this.self;
dr.b = true;
},
mouseup : function () {
var dr = this.self;
dr.b = false;
},
mouseout : function () {
var dr = this.self;
dr.b = false;
},
mousemove : function() {
var e = arguments[0];
var dr = this.self;
if (dr.b) {//此处 在 mf下 dr.b仍然存在,但到 下面的 dr.o时却是 undefined,ie可正常起作用
dr.o.style.left = e.clientX - dr.o.offsetWidth/2 + 'px ';
dr.o.style.top = e.clientY - dr.o.offsetHeight/2 + 'px ';
}
}
};
var o = document.getElementById( 'div1 ');
var drag = new drag();
drag.setObject(o);
</script>
</body>
</html>
[解决办法]
嘿嘿。。散过啦。。那天你没来。。。
/gg
http://community.csdn.net/Expert/topic/5520/5520751.xml?temp=.8313715
这个是散分的地址。。
已经结帖子啦。
to ls
o.self = this;
这句话不是给o加了个self属性么？
