jquery - bootstrap - tooltip button
Controlador del valor de cambio del control deslizante Bootstrap (4)
Estoy usando Bootstrap Slider, y me preguntaba si hay alguna forma de incluir un controlador para un cambio de valor. Veo que la documentación incluye controladores para slideStart, slide y slideStop, pero ninguno para "cambiar" (de valor).
Es posible que puedan deslizar el control deslizante alrededor y (una vez liberado) terminar con el mismo valor, en cuyo caso NO quisiera que el evento se dispare. Solo si lo deslizan a un nuevo valor.
He intentado:
$(''#sliderAdminType'').slider({
formater: function(value) {
// my formater stuff that works
},
change: function(event, ui) {
console.log("has changed");
}
});
y
$(''#sliderAdminType'').change(function() {
console.log("has changed");
});
y
$(''#sliderAdminType'').slider().change(function() {
console.log("has changed");
});
y
$(''body'').on(''change'', ''#sliderAdminType'', function(e){
console.log("has changed");
});
En lugar de cambiar el evento solo usa la diapositiva. El promotor no está funcionando bien, así que en Diapositiva puede establecer el valor nuevamente.
var thresholdSlider = $(''#Threshold'');
thresholdSlider.slider({
formater: function (value) {
return ''Current value: '' + value;
}
});
thresholdSlider.slider().on(''slide'', function (ev) {
thresholdSlider.slider(''setValue'', ev.value);
});
La respuesta aceptada no es válida para el rango: control deslizante verdadero
Aquí está el doble control deslizante: https://jsfiddle.net/oayj5Lhb/
Para el control deslizante doble: el evento "cambiar" devuelve los objetos newValue y oldValue . Tenga en cuenta que los eventos ''change'', ''slideStart'', ''slideStop'' se activan con el movimiento del mouse (cuando pregunté por qué la respuesta era "esta es la forma correcta de implementación", para mí parece un poco extraño). Aquí un ejemplo:
$(''#your-slider'').slider().on(''change'', function(event) {
var a = event.value.newValue;
var b = event.value.oldValue;
var changed = !($.inArray(a[0], b) !== -1 &&
$.inArray(a[1], b) !== -1 &&
$.inArray(b[0], a) !== -1 &&
$.inArray(b[1], a) !== -1 &&
a.length === b.length);
if(changed ) {
//your logic should be here
}
});
Tenga en cuenta: [2, 1] y [1, 2] se consideran iguales porque el par deslizante puede ser intercambiable.
Prueba esto si la función no te ha funcionado como a mí.
$(''#yourSlider'').bind("slideStop", function (e)
Puedes hacer los siguientes pasos:
1) Use el evento slideStart
para obtener el valor original de su control deslizante
2) Utilice el evento slideStop
para obtener el nuevo valor de su control deslizante
3) Compara este valor de dos, si es diferente, entonces dispara tu código
var originalVal;
$(''.span2'').slider().on(''slideStart'', function(ev){
originalVal = $(''.span2'').data(''slider'').getValue();
});
$(''.span2'').slider().on(''slideStop'', function(ev){
var newVal = $(''.span2'').data(''slider'').getValue();
if(originalVal != newVal) {
alert(''Value Changed!'');
}
});