簡體   English   中英

調用javascript函數形式的jquery

[英]Call javascript function form jquery

我在Jquery中使用javascript函數時遇到問題。 我想獲得最大和最小值的jQuery SLIDER。 請幫忙。

這是標記。

$(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;">

我不確定我是否完全了解您的問題,

但是使用jquery調用函數就像這樣。

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

這是您要找的東西嗎?

在沒有檢查您的總體邏輯的情況下,我可以指出一個即時錯誤:

document.getElementById('.price_range')

.price_range是CSS選擇器。 getElementById需要文檔中元素的ID,因此為了使選擇器起作用,請改用jQuery。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM