Jquery UI Slider - Geben Sie einen Wert und Slider Move to Location

Question

Ich frage mich, ob jemand eine Lösung oder ein Beispiel gefunden hat, um die Eingabe-Box eines Schiebereglers zu füllen und es auf die richtige Position onBlur() schieben. Wie wir alle wissen, aktualisiert es nur diesen Wert mit der Position, in der Sie sich befinden. In gewisser Hinsicht versuche ich, die Funktionalität dieses erstaunlichen Sliders umzukehren.

Ein Link, den ich gefunden: http://www.webdeveloper.com/forum/archive/index.php/t-177578.html ist ein bisschen veraltet, aber sieht aus wie sie einen Versuch gemacht haben. Die Links zu den Ergebnissen existieren jedoch nicht. Ich hoffe, dass es da draußen eine Lösung gibt.

Ich weiß, Filament hat den Schieberegler neu entwickelt, um ausgewählte (Dropdown) Werte zu handhaben, und es funktioniert einwandfrei .. So wäre das Ziel, das gleiche zu tun, aber mit einem Eingabetextfeld.

Answer 1

Wird dies tun, was Sie wollen?

$("#slider-text-box").blur(function() { 
    $("#slider").slider('option', 'value', parseInt($(this).val())); 
}); 

Jede Option auf dem Schieber hat einen Setter sowie einen Getter, so dass Sie den Wert mit, dass, wie im Beispiel oben einstellen. Aus der Dokumentation:

//getter 
var value = $('.selector').slider('option', 'value'); 
//setter 
$('.selector').slider('option', 'value', 37); 

UPDATE:

Für die Dual-Slider Sie verwenden müssen:

$("#amount").blur(function() { 
    $("#slider-range").slider("values", 0, parseInt($(this).val())); 
}); 
$("#amount2").blur(function() { 
    $("#slider-range").slider("values", 1, parseInt($(this).val())); 
}); 

Sie müssen Math.min/max verwenden, um einen Wert doesn, um sicherzustellen, dass Gehen Sie nicht an der anderen vorbei, da der Aufseher das nicht zu verhindern scheint.

Sie waren fast da, als Sie die $("#slider-range").slider("values", 0) verwendeten, um jeden Wert zu erhalten. Eine Menge von jQuery hat diese Art von get/set-Konvention, in der der zusätzliche Parameter verwendet wird, um den Wert festzulegen.

Answer 2

Ich habe einige Arbeit rund um den Schieber jQuery UI getan, um es Werte aus einer Textbox akzeptieren zu machen, ist es nicht genau das sein kann, was nach waren aber helfen könnte:

http://chowamigo.blogspot.com/2009/10/jquery-ui-slider-that-uses-text-box-for.html

Answer 3

$slider = $("#slider"); 
      $("#amountMin").blur(function() {  
       $slider.slider("values", 0,Math.min($slider.slider("values", 1),parseInt($(this).val()))); 
       $(this).val(Math.min($slider.slider("values", 1),parseInt($(this).val()))); 

      }); 
      $("#amountMax").blur(function() { 
       $slider.slider("values",1,Math.max($slider.slider("values", 0),parseInt($(this).val())));        
       $(this).val(Math.max($slider.slider("values", 0),parseInt($(this).val()))); 
      }); 

I habe gerade den Code von Martin benutzt und die ID zu #slider aktualisiert. Außerdem habe ich die math.max wie vorgeschlagen hinzugefügt, damit sich die Schieberegler nicht überschneiden.