Question

看一下这段代码：

$(document).ready(function() {
    document.getElementById(sliderId).onmousedown = sliderMouseDown;
});

function sliderMouseDown() {
    document.onmousemove = sliderMouseMove; 
    document.onmouseup   = sliderMouseUp;
}

function sliderMouseMove() {
    $('#test').html("sliding");
}

function sliderMouseUp() {
    $('#test').html("not sliding");
    document.removeEventListener('mousemove', sliderMouseMove, false);
    document.removeEventListener('mouseup', sliderMouseUp, false);
}

一切正常，直到调用sliderMouseUp函数。现在，函数调用正常，＃test-div表示“不滑动”，但如果我之后在文档中移动鼠标，它会再次在#test-div中显示“滑动”，就像removeEventListener函数一样不起作用。我在这里做错了吗？

Answer 1

如果jQuery是一个选项，并且似乎是因为你正在使用它，请执行以下操作：

$(function() {
  $("#" + sliderId).mousedown(function() { 
    $(document).mousemove(function() { 
      $("#test").html("sliding");
    }).mouseup(function() {
      $("#test").html("not sliding");
      $(document).unbind("mousemove mouseup");
    });
  });
});

使用jQuery事件模型可以减少毛发，让它为您解决跨浏览器和事件怪癖。

在文档上使用removeEventListener不起作用？

1 个答案: