Jquery UI在同一页面上有两个滑块

我在同一个页面上有两个jquery ui滑块，具有不同的值范围，但是当我更改其中一个时，另一个也会更改，即使它们具有不同的变量，我希望它们不会相互影响，因此当我将一个滑块的值设置为更大或更小时，另一个滑块不会更改

 var sliderTooltipAge = function(event, ui) {
    var curValue = ui.value || initialValueAge;
    var tooltip_age = '<div class="tooltip"><div class="tooltip-inner">' + curValue + '</div><div class="tooltip-arrow"></div></div>';

    $('.ui-slider-handle').html(tooltip_age);

}
    $( "#slider-range-min" ).slider({
      range: "min",
      step: 1,
      value: 25,
      min: 18,
      max: 65,
      create: sliderTooltipAge,
      slide: sliderTooltipAge,

    });

};


function slider_sum() {
       var initialValue = 20000;

var sliderTooltip_sum = function(event, ui) {
    var curValue2 = ui.value || initialValue;
    var tooltip_sum = '<div class="tooltip"><div class="tooltip-inner">' + curValue2 + '</div><div class="tooltip-arrow"></div></div>';

    $('.ui-slider-handle').html(tooltip_sum);

}
    $( "#slider-range-loan" ).slider({

    value: initialValue,
    min: 20000,
    max: 1000000,
    step: 1000,
    create: sliderTooltip_sum,
    slide: sliderTooltip_sum
    });
  };

var sliderTooltipAge=函数（事件，用户界面）{
var curValue=ui.value | | initialValueAge；
变量工具提示_年龄=''+曲线值+''；
$（'.ui滑块句柄'）.html（工具提示）；
}
$（“#滑块最小范围”）.滑块({
射程：“分钟”，
步骤：1，
价值：25，
民:18,，
最高：65，
创建：sliderTooltipAge，
幻灯片：幻灯片工具页，
});
};
函数slider_sum（）{
var初始值=20000；
var sliderTooltip_sum=函数（事件，用户界面）{
var curValue2=ui.value | | initialValue；
变量工具提示_sum=''+曲线值2+''；
$（'.ui滑块句柄'）.html（工具提示\u sum）；
}
美元（“#滑块范围贷款”）。滑块({
value:initialValue，
最小值：20000，
最大值：1000000，
步骤：1000，
创建：sliderTooltip\u sum，
幻灯片：幻灯片工具提示
});
};

HTML

---

更改第一个和第二个$（'.ui滑块句柄'）.html（工具提示）

到

$（“#滑块范围最小.ui滑块句柄”）.html（工具提示）

及

$（'#slider range loan.ui slider handle'）.html（工具提示\u sum）

分别

---

这就是你所期望的吗？

希望能有所帮助。。但是在问你的问题之前，请进行更多的搜索。你会在stackoverflow的某个地方找到你的答案。。幸运的是，问题是，我的滑块使用不同的最小值和最大值

 <div id="slider-range-loan"></div> 
  <div id="slider-range-min"></div>