JQuery, развязывая событие mouseWheel, затем снова переплетая его после действий завершается?
Я боролся с этим на некоторое время теперь.. Я использую этот код для контроля mousewheel, таким образом, он может использоваться для прокрутки с ползунком, который я имею.. однако, это имеет проблему, где действия стоят в очереди поэтому, если бы Вы прокручиваете с mousewheel быстро (как любой, обычно делал бы), они растут, и это вызывает ошибочное поведение.. Я знаю об обработке этого вида проблемы с анимацией, но не с монитором mousewheel..
Я хочу сделать что-то, любят, развязывают mousewheel в начале действия (в этом случае, для прокрутки полосы прокрутки после того, как mousewheel перемещен), затем снова переплетают его после этого поэтому если пользователь делает слишком много прокруток слишком быстро, это просто игнорирует, пока начальная прокрутка не завершается.. Я попробовал код ниже, но не повторное переплетение, таким образом, я не уверен, что я делаю неправильно, любой совет ценится.
$("#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");
});
1 ответ
Вам нужно сохранить функцию, где вы можете ссылаться на нее, например:
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 () , поэтому он отключает только этот обработчик, а не любое колесо мыши ] обработчик.
В качестве альтернативы, сделайте это без un / re-binding, например так:
$("#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 () для хранения данных «мы работаем» запись с элементом, если что-то попадает в этот обработчик, пока он истинен, он просто возвращается и игнорирует событие.