jQuery UI Slider (réglage par programmation)
J'aimerais modifier les curseurs à la volée. J'ai essayé de le faire en utilisant
$("#slider").slider("option", "values", [50,80]);
Cet appel permettra de définir les valeurs, mais l'élément ne sera pas mise à jour le curseur de position.
L'appel de
$("#slider").trigger('change');
n'aide pas non plus.
Est-il un meilleur moyen pour modifier la valeur ET la position du curseur?
Vous devez vous connecter pour publier un commentaire.
Cela dépend si vous voulez changer les curseurs de la plage de courant ou de modifier la gamme des curseurs.
Si c'est les valeurs dans la plage que vous souhaitez modifier, puis l' .curseur() la méthode est celui que vous devez utiliser, mais la syntaxe est un peu différente de celle que vous avez utilisé:
ou si vous avez un curseur avec deux poignées, il serait:
Si c'est la plage que vous voulez changer, il serait:
change
gestionnaire d'événements, de ne pas leslide
gestionnaire d'événement.$("#slider").slider('value', 50, 80);
Pour moi, c'parfaitement déclencheurs de diapositives événement UI Slider :
N'oubliez pas de définir la valeur par
hs.slider('option', 'value',h);
avant le déclenchement. D'autre curseur gestionnaire de ne pas être en phase avec la valeur.Une chose à noter ici est que
h
est l'indice de position/(pas de valeur) dans le cas où vous êtes à l'aide de htmlselect
.$('#minPrice, #maxPrice').blur(function() { var max = parseInt($('#maxPrice').val()); var min = parseInt($('#minPrice').val()); if (min > max) return false; var hs = $("#slider-range"); hs.slider("values", 0, min); hs.slider("values", 1, max); hs.slider('option', 'slide').call(hs, null, {handle: $('.ui-slider-handle', hs), values: [min, max]}); });
Où #minPrice et #maxPrice sont les deux zones de texte.Aucune des réponses ci-dessus a fonctionné pour moi, peut-être qu'ils étaient basés sur une ancienne version du framework?
Tout ce que j'avais à faire était de définir la valeur du sous-jacent de contrôle, puis d'appeler la méthode refresh, comme ci-dessous:
Error: no such method 'refresh' for slider widget instance
d'erreur dans google chrome$("#slider").val(50).slider("refresh");
Mal de réponse a été la seule qui a fonctionné pour moi (peut-être jqueryUI a changé), voici une variante pour traiter toute une gamme:
Une partie de @gaurav solution a fonctionné pour jQuery 2.1.3 et l'INTERFACE utilisateur de JQuery 1.10.2 avec plusieurs curseurs. Mon projet est à l'aide de quatre curseurs de plage pour filtrer les données avec cette filter.js plugin. D'autres solutions ont été réinitialiser le curseur poignées de retour à leur point de départ des points très bien, mais apparemment, ils n'étaient pas de tir d'un événement qui filter.js compris. Donc voici comment j'ai bouclé les curseurs:
La
hs.slider()
code réinitialise les données, mais pas de l'INTERFACE utilisateur dans mon scénario. Espérons que cela aide les autres.Il est possible de déclencher manuellement des événements comme ceci:
Appliquer le curseur de comportement de l'élément
...
Définir la valeur d'un curseur
Déclencher la diapositive événement, le passage d'un objet d'interface utilisateur
Si vous avez besoin de changer de curseur de valeurs à partir de plusieurs entrées, utiliser:
html:
js:
https://jsfiddle.net/brhuman/uvx6pdc1/1/
Je voulais mettre à jour curseur ainsi que la méthode inputbox.
Pour moi qui suit est de travail
où
a
est l'objet de la manière suivante.Dans mon cas avec jquery slider avec 2 poignées seule façon suivante travaillé.
Sur démarrer ou à l'actualisation de la valeur = 0 (par défaut)
Comment obtenir la valeur de la requête http
Enfin ci-dessous fonctionne pour moi
$("#priceSlider").curseur('option',{min: 5, max: 20,de la valeur:[6,19]});
$("#priceSlider").curseur("refresh");
Ici est la version de travail: