jQuery-UI slider - how to disable keyboard input?
in jQuery-UI Slider arrow keys move the slider handle (after the handle has been selected/clicked on), which is nice, but I don't want slider to handle keyboard (I use arrow keys on the page for another purpouse).
开发者_开发知识库Any ideas how to disable keyboard events for jquery-ui slider?
You can unbind the keydown
event from the handle to do what you want, like this:
$("#slider").slider(); //create slider
$("#slider .ui-slider-handle").unbind('keydown'); //disable keyboard actions
You can see a demo here
You can also automate the above solution like so:
$.prototype.slider_old = $.prototype.slider;
$.prototype.slider = function()
{
var result = $.prototype.slider_old.apply(this, arguments);
this.find(".ui-slider-handle").unbind("keydown"); // disable keyboard actions
return result;
}
Just have this code run sometime before you make the "$(...).slider()" calls, and it should remove the keydown event for each one automatically, right after slider initialization.
I'd recommend using the slider's create
callback to unbind keydown
like so:
$( "#slider" ).slider({
create: function() {
disableKeydown();
}
});
function disableKeydown() {
$(".ui-slider-handle").unbind('keydown');
}
Depending on the context in which the first answer is executed, there's no guarantee that the unbind
function will be called after a slider is initialized. The second answer helps to solve for this, but I think adhering to the API documentation provided by jquery UI makes this a more dev-friendly approach that results in less code ambiguity.
精彩评论