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

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
});

Answer 2

您必须将更改事件处理程序绑定到滑块，如下所示。

$(".js-range-slider").on("change", function () {
    // Do whatever you want here
});

有关其他信息，请参阅Jquery docs https://api.jquery.com/change/