阅读价格受苦的价值观

Question

使用 ui jquery 插件获得了价格范围。我想在 javascript 中读取最低和最高价格范围，我使用了这些代码。但它不读取 minamout 和 maxamount。如何正确读取 minamount 和 maxamount。我想在脚本的另一个函数中使用它们。

        <div id="slider"></div>
        <p> <span id="slider-value"></span></p>



        <script>

        const numberFormat = new Intl.NumberFormat();
        $("#slider").slider(
            {
                range: true,
                values: [1000, 4005000],
                min: 1000,
                max: 4005000,
                step: 10000,
                slide: function (event, ui) {
                    console.log(ui);
                    $("#slider-value").html(`${numberFormat.format(ui.values[0])} تومان  —   ${numberFormat.format(ui.values[1])}تومان`);


                }
            }
        );
        var values = $('#slider').slider('values');
        $("#slider-value").html(` ${numberFormat.format(values[0])} تومان  —     ${numberFormat.format(values[1])}تومان`);

         var minamount = $("#slider-value").html(values[0]);
        var maxamount = $("#slider-value").html(values[1]);



    </script>
</div>

Answer 1

您可以在滑块的slide 事件处理程序中读取最小值和最大值，并使用$( "#slider" ).slider( "option", "values" ) 读取值。

您可以创建最小数量和最大数量值的数组并将其设置为滑块

见下面的代码

$(function(){
var minAmount = 1000;
var maxAmount = 4005000;
const numberFormat = new Intl.NumberFormat();
        $("#slider").slider(
            {
                range: true,
                values: [1000, 4005000],
                min: 1000,
                max: 4005000,
                step: 10000,
                slide: function (event, ui) {
                     var values = $( "#slider" ).slider( "option", "values" );
                     $('#min').html(values[0]);
                     $('#max').html(values[1]);
                // set min and max values in variable which you can read to any other function
                minAmount = values[0];
                maxAmount = values[1];
                }
            }
        );
     // push min and max values and set it to slider
     var min = 200000;
     var max = 3100000;
     var valuesArray = [min, max];
     $( "#slider" ).slider( "option", "values", valuesArray );
 });

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <div id="slider"></div>
  <div id="min"></div>
  <div id="max"></div>