example - jquery ui button

Control deslizante de jQuery-UI: ¿cómo desactivar la entrada del teclado?

Question

en jQuery-UI Las teclas de flecha del control deslizante mueven el control deslizante (después de seleccionar / hacer clic en el control), lo que es bueno, pero no quiero que el control deslizante maneje el teclado (utilizo las teclas de flecha en la página para otro propósito).

¿Alguna idea sobre cómo deshabilitar los eventos de teclado para el control deslizante jquery-ui?

Answer 1

Puede desvincular el evento de selección desde el controlador para hacer lo que desee, como este:

$("#slider").slider(); //create slider
$("#slider .ui-slider-handle").unbind(''keydown''); //disable keyboard actions

Puedes ver una demostración aquí

Answer 2

También puede automatizar la solución anterior de la siguiente manera:

$.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;
}

Simplemente haga que este código se ejecute en algún momento antes de realizar las llamadas "$ (...). Slider ()", y debe eliminar el evento de tecla para cada uno automáticamente, inmediatamente después de la inicialización del control deslizante.

Answer 3

Recomiendo usar la función de devolución de llamada del control deslizante para desvincular la keydown manera:

$( "#slider" ).slider({
  create: function() {
    disableKeydown();
  }
});

function disableKeydown() {
  $(".ui-slider-handle").unbind(''keydown'');
}

Dependiendo del contexto en el que se ejecuta la primera respuesta, no hay garantía de que se unbind función de unbind después de que se haya inicializado un control deslizante. La segunda respuesta ayuda a resolver esto, pero creo que al adherirnos a la documentación de la API provista por jquery UI hacemos que este sea un enfoque más amigable para los desarrolladores que da como resultado una menor ambigüedad en el código.