javascript - 如何在用户每次更改时获取选择器的值

Question

我想知道如何在用户每次单击某个值时获取选择器的值。

这样做的目的是将变量传递给 php 并影响 javascript 中的另一个变量。

我看到 documentation here谈论 OnChange 但我根本不明白。

var custom_values = [100, 200, 300, 400, 500];
var my_from = custom_values.indexOf(100);
var my_to = custom_values.indexOf(500);

$(".js-range-slider").ionRangeSlider({
  grid: true,
  from: my_from,
  to: my_to,
  values: custom_values,
  min: 0,
  postfix: "BRO",
  onChange: function(data) {
    console.dir(data);
  }
});

<!--Plugin CSS file with desired skin-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.0/css/ion.rangeSlider.min.css" />

<!--jQuery-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!--Plugin JavaScript file-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.0/js/ion.rangeSlider.min.js"></script>

<input type="text" class="js-range-slider" name="my_range" value="" />

Answer 1

试试这个

$(".js-range-slider").on("change", function () {
    var $inp = $(this);
    var from = $inp.prop("value"); // reading input value
    var from2 = $inp.data("from"); // reading input data-from attribute

    console.log(from, from2); // FROM value
});