Metin kutusu girişi olan kaydırıcıyı kaydır

Question

Kullandığımız bir ui kaydırıcımız var ve kusursuz çalışıyor.

kodu:

jQuery(function() { 
jQuery("#slider-range-min").slider({ 
    range: "min", 
    value: 1, 
    step: 1000, 
    min: 0, 
    max: 5000000, 
    slide: function(event, ui) { 
     jQuery("#amount").val("$" + ui.value); 
    } 
}); 
jQuery("#amount").val("$" + $("#slider-range-min").slider("value")); 
}); 

biz kullanıcı 0 ile 5.000.000 arasında bir şey almak için izin görebileceğiniz gibi.

Html geçerli:

<div id="slider-range-min" style="width: 460px; float:left;margin:10px;"></div> 

Ne yapmak istiyorum, kaydırıcı ile uyum içinde çalışan bir metin giriş öğesi ekleyin Kullanıcı texy kutusu artar, ne olursa olsun azalır slaytlar şekilde ..

Veya kullanıcı sayıları giriş elemanına yazarsa, kaydırıcı uygun şekilde hareket eder.

Herhangi bir yardım lütfen?

Önizleme geçerli:

Answer 1

Sen (siz #amount elemanı için şimdi yapıyoruz gibi) slide üzerinde input elemanı güncellemeniz gerekir:

$("#slider").slider({ 
    range: "min", 
    value: 1, 
    step: 1000, 
    min: 0, 
    max: 5000000, 
    slide: function(event, ui) { 
     $("input").val("$" + ui.value); 
    } 
}); 

Ayrıca, gerek input öğesi için change olayına bağlanın ve kaydırıcının value yöntemini çağırın:

$("input").change(function() { 
    var value = this.value.substring(1); 
    console.log(value); 
    $("#slider").slider("value", parseInt(value)); 
}); 

Örnek: burada devam hiçbir doğrulama yokhttp://jsfiddle.net/andrewwhitaker/MD3mX/

(Eğer "$" içermelidir işe imza). Bunu geliştirmek için biraz daha sağlam giriş sanitasyonu ekleyebilirsiniz.