我有一個問題,在JQuery中使用JavaScript函數。 我想獲得最大和最小值的jQuery的滑塊。 請幫忙。調用javascript函數形式jquery
這是標記。
$(document).ready(function() {
下面是函數MAX
function getMax()
{
var options = document.getElementById('.price_range').childNodes;
var min = 999999999;
for(var i = 0; i < options.length; i++) {
if(options[i].value > max) max = options[i].value;
}
return max;
}
下面是函數MIN
function getMin()
{ var options =document.getElementById('my_max').childNodes;
var min = 999999999;
for(var i = 0; i < options.length; i++) {
if(options[i].value < min) min = options[i].value;
}
return min;
}
來了滑蓋功能,它從javascript函數
得到最小值和最大值 // Slider
$('#slider').slider({
range: true,
min: getMin(),
max: getMax(),
step: 10, // Use this determine the amount of each interval
values: [ 20, 40 ], // The default range
slide: function(event, ui) {
$("#amount").val(ui.values[ 0 ] + " - " + ui.values[ 1 ]); // for input text box
$("#my_min").val(ui.values[ 0 ]); // Display and selected the min Price
$("#my_max").val(ui.values[ 1 ]); // Display and selected the max Price
}
});
//For dropdown box
$("#my_min").val($("#slider").slider("values", 0));
$("#my_max").val($("#slider").slider("values", 1));
$("select.price_range").change(function() {
$myMinValue = $("#my_min option:selected").val();
$myMaxValue = $("#my_max option:selected").val();
//Make changes on the slider itself
if($myMinValue <= $myMaxValue) {
$("#slider").slider({
values: [$myMinValue, $myMaxValue]
});
} else {
alert("Invalid Input");
}
});
});
這裏是index.html的
<body>
<select id="my_min" class="price_range">
<option value="0">0</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
</select>
<select id="my_max" class="price_range">
<option value="0">0</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
</select
><!-- Slider -->
<h2 class="demoHeaders">Slider</h2>
<label for="amount">Price range:</label>
<input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;">
謝謝,求助:) – 2012-07-13 11:54:16