Jquery,取消绑定鼠标滚轮事件,然后在操作完成后重新绑定它?

我一直在努力解决这个问题.我正在使用这个代码来监控鼠标滚轮所以它可以用于我用滑块滚动…但是,它有一个问题,操作排队等等如果你用鼠标滚动快速滚动(就像任何人会正常做的那样)它们会累积并导致错误的行为..我知道用动画处理这类问题,但不是用鼠标滚轮监视器.

我想做一些事情,比如在动作开始时取消绑定鼠标滚轮(在这种情况下,在鼠标滚轮移动后滚动滚动条)然后重新绑定它,所以如果用户做太多滚动太快它只是忽略直到最初滚动完成..我尝试下面的代码,但它没有重新绑定,所以我不知道我做错了什么,任何建议表示赞赏.

        $("#wavetextcontainer").bind("mousewheel", function(event, delta) {

   //HERE IS WHERE EVENT IS UNBOUND:
     $("#wavetextcontainer").unbind("mousewheel");

        var speed = 10;
        var mySlider = $("#slider");
        var sliderVal = mySlider.slider("option", "value");

        sliderVal += (delta*speed);

        if (sliderVal > mySlider.slider("option", "max")) sliderVal = mySlider.slider("option", "max");
        else if (sliderVal < mySlider.slider("option", "min")) sliderVal = mySlider.slider("option", "min");

        $("#slider").slider("value", sliderVal);

        event.preventDefault();

      // HERE I WANT TO REBIND THE EVENT:
     $("#wavetextcontainer").bind("mousewheel");

});
最佳答案
您需要存储函数,您可以引用它,如下所示:

function myHandler(event, delta) {
     $("#wavetextcontainer").unbind("mousewheel", myHandler);

        var speed = 10;
        var mySlider = $("#slider");
        var sliderVal = mySlider.slider("option", "value");

        sliderVal += (delta*speed);

        if (sliderVal > mySlider.slider("option", "max")) sliderVal = mySlider.slider("option", "max");
        else if (sliderVal < mySlider.slider("option", "min")) sliderVal = mySlider.slider("option", "min");

        $("#slider").slider("value", sliderVal);

        event.preventDefault();

      // HERE I WANT TO REBIND THE EVENT:
     $("#wavetextcontainer").bind("mousewheel", myHandler);    
};

$("#wavetextcontainer").bind("mousewheel", myHandler);

通过这样做,您可以稍后调用.bind()到相同的功能(您不能引用匿名功能).您目前正在尝试调用.bind()而没有处理任何功能的功能,这不起作用.这还有一个额外的好处,即能够将相同的函数引用传递给.unbind(),因此它只解除处理程序,而不是任何鼠标轮处理程序.

或者,在没有取消/重新绑定的情况下执行此操作,如下所示:

$("#wavetextcontainer").bind("mousewheel", function (event, delta) {
  event.preventDefault();
  if($.data(this, 'processing')) return; //we're processing, ignore event

  $.data(this, 'processing', true);
  var speed = 10;
  var mySlider = $("#slider");
  var sliderVal = mySlider.slider("option", "value");

  sliderVal += (delta*speed);

  if (sliderVal > mySlider.slider("option", "max")) sliderVal = mySlider.slider("option", "max");
  else if (sliderVal < mySlider.slider("option", "min")) sliderVal = mySlider.slider("option", "min");

  $("#slider").slider("value", sliderVal);
  $.data(this, 'processing', false);
});

这只是使用$.data()存储一个“我们正在工作”的数据条目与元素,如果有什么命中这个处理程序,它是真的,它只是返回并忽略该事件.

转载注明原文:Jquery,取消绑定鼠标滚轮事件,然后在操作完成后重新绑定它? - 代码日志