javascript - 我如何通过使用jQuery UI范围滑块更改变量的值

想象一下我有setInterval

setInterval(function() {
    console.log("Hi");
}, 1000);

想象一下，我有setInterval和那个随机函数，它将在每次调用时生成随机数。

setInterval(function() {
        console.log("Hi");
    }, 1000 + Math.random() * 4000);

它将在1到4秒之间调用setInterval

现在，我想要的是使用那种滑块来更改整数的值：
https://jsfiddle.net/qetwstkb/

我想使用滑块来操纵这些值。 :)
抱歉，不是母语为英语的人无法解释。 > _ <

最佳答案

要获取选定的范围值，可以使用：

var min = $("#slider").slider("values")[0];
var max = $("#slider").slider("values")[1];

要在值更改时执行回调函数，请使用slide选项。

一旦有了值，就可以将这些值放在任何地方，包括setInterval函数。

$(document).ready(function() {

$(function(){

  var update = function() {
    var min = $("#slider").slider("values")[0];
    var max = $("#slider").slider("values")[1];

     var i = setInterval(function() {
        console.log("Hi");
    }, min + Math.random() * max);

    return i;
  }

  var i;

  $("#slider").slider({
    values: [1000, 1750],
    min: 500,
    max: 3900,
    step: 0.1,
    slide: function (e, ui) {
      clearInterval(i);
      i = update();
    }

  });

});

});

<link href="https://code.jquery.com/ui/1.9.1/themes/black-tie/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<div id="slider"></div>