2012-07-13 30 views
0

我有一个问题,在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;"> 

回答

0

林不知道如果我完全理解你的问题,

但调用使用jQuery的功能是这样的。

$(document).ready(function() { 
    var returnvalue = functionname(); 
}); 

这是你要找的吗?

+0

谢谢,求助:) – 2012-07-13 11:54:16

0

不经审阅你的整体逻辑,我可以指出一个即时错误:

document.getElementById('.price_range') 

.price_range是一个CSS选择器。 getElementById需要文档中元素的ID,因此为了使选择器工作,请使用jQuery。

+0

为什么不使用jquery? $( 'PRICE_RANGE')VAL()。并且是你想要1值更好选择1使用ID如此:$('#my_min')。val(); – VDP 2012-07-13 11:28:57

+0

完成,看我的编辑。 – 2012-07-13 11:38:12