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

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事件模型將減少很多麻煩，讓它為您處理跨瀏覽器和事件怪癖。