jQuery यूआई स्लाइडर तय मूल्यों

Question

मैं jQuery स्लाइडर पाने के लिए कोशिश कर रहा हूँ के रूप में मिनट & अधिकतम मात्रा के बीच हर नंबर के बजाय करने के लिए स्लाइड करने के लिए मूल्यों को निर्धारित की है।

मैं चाहता हूँ "0, 25, 50, 100, 250, 500" केवल मात्रा में लोगों को भी स्लाइड कर सकते हैं, लेकिन बाहर काम नहीं कर सकता कि यह कैसे हुआ है। उन्हें "मूल्य" भाग में डालकर कुछ भी नहीं लगता है।

<script type="text/javascript"> 
$(function() { 
    $("#slider-range").slider({ 
     range: true, 
     min: 0, 
     max: 500, 
     values: [100, 250], 
     slide: function(event, ui) { 
      $("#amount").val('Miles: ' + ui.values[0] + ' - ' + ui.values[1]); 
     } 
    }); 
    $("#amount").val('Miles: ' + $("#slider-range").slider("values", 0) + ' - ' + $("#slider-range").slider("values", 1)); 
}); 
</script> 

Answer 1

मान प्रारंभकर्ता एकाधिक अंगूठे स्लाइडर्स की शुरुआती स्थिति प्रदान करने के लिए है।

मैं, संभावित मानों की एक सरणी प्रदान करते हैं स्लाइडर को बदलने कि सरणी की सीमा पर मैप करने के लिए, और फिर अपनी प्रस्तुति सा बदल उचित सरणी तत्व से पढ़ने के लिए होगा।

सीमा स्लाइडर: बहु-अंगूठे संस्करण

$(function() { 
    var valMap = [0, 25, 50, 100, 250, 500]; 
    $("#slider-range").slider({ 
     min: 0, 
     max: valMap.length - 1, 
     values: [0, 1], 
     slide: function(event, ui) {       
      $("#amount").val('Miles: ' + valMap[ui.values[0]] + ' - ' + valMap[ui.values[1]]);     
     }  
    }); 
    $("#amount").val('Miles: ' + valMap[$("#slider-range").slider("values", 0)] + ' - ' + valMap[$("#slider-range").slider("values", 1)]); 
}); 

सीमा स्लाइडर: एकल अंगूठे संस्करण

---

$(function() { 
    var valMap = [0, 40, 50, 63, 90, 110, 125, 140, 160, 225, 250]; 
    $("#slider-range").slider({ 
     min: 1, 
     max: valMap.length - 1, 
     value: 0, 
     slide: function(event, ui) {       
      $("#amount").val(valMap[ui.value]);     
     }  
    }); 
    //$("#amount").val(valMap[ui.value]); 
}) 

;

न्यूनतम एचटीएमएल:

<input type="text" id="amount" value="40" /> 
<div id="slider-range"></div>