日期:2014-05-16  浏览次数:20454 次

关于事件绑定的一个问题
刚学JS不久,昨天做了一个小DEMO,是关于拖拽DIV的,尝试了addEventListener的方法,发现行不通,不知道代码错在哪里,所以上来求助了:

        var b = document.getElementById("block");
var drag = false;
function getevent(e) {
return (e)?e:window.event;
}
b.addEventListener("onmousedown",function(e) {
console.log("done!");
drag = true;
var x = getevent(e).clientX;
var y = getevent(e).clientY;
postop = b.offsetTop; posleft = b.offsetLeft;
b.addEventListener("onmousemove",function(e) {
if(!drag) return false;
b.style.top = postop + getevent(e).clientY - y +"px";
b.style.left = posleft + getevent(e).clientX - x +"px";
});
});
b.addEventListener("onmouseup",function(e) {
drag = false;
});


相同的效果我用以下代码又可以行得通,不知道为啥:

b.onmousedown = function(e) {
drag = true;
postop = b.offsetTop; posleft = b.offsetLeft;
x = getevent(e).clientX; y = getevent(e).clientY;
b.onmousemove = function(e) {
if(!drag) return false;
b.style.top = postop + getevent(e).clientY - y +"px";
b.style.left = posleft + getevent(e).clientX - x +"px";
}
}
b.onmouseup = function(e) {
drag = false;
}

是不是我某个地方还有欠缺,求高人指点
JavaScript 事件绑定

------解决方案--------------------
用addEventListener绑定事件的话是不需要'on'的。直接mouseup什么的

另外就是IE不支持addEventListener.