Jquery ui 多次使用jquery ui滑块，但php以编程方式设置了不同的最小-最大值

我使用jquery ui和一些范围滑块，它们在外部JavaScript文件中指定，如下所示：

$( function() {
$( ".slider-range" ).slider({
  range: true,
  min: 0,
  max: 500,
  values: [ 75, 300 ],
  slide: function( event, ui ) {
    $(this).prev().val( ui.values[ 0 ] + "-" + ui.values[ 1 ] );
  }
});
$(".slider-range").on("slidestop", function(event, ui) {
    $(this).prev().val( ui.values[ 0 ] + "-" + ui.values[ 1 ] );
    localStorage.setItem(this.getAttribute("id") + '_min', ui.values[ 0 ]);
    localStorage.setItem(this.getAttribute("id") + '_max', ui.values[ 1 ]);
    aktualisiert();
});
$('.slider-range').prev().val( $( ".slider-range" ).slider( "values", 0 ) +
  "-" + $( ".slider-range" ).slider( "values", 1 ) );
});

$(window).bind("load", function() {
    var range_sliders = document.getElementsByClassName("slider-range");
    for (i = 0; i < range_sliders.length; i++) {
        if (localStorage.getItem(range_sliders[i].getAttribute("id") + '_min') != null){
            $('#' + range_sliders[i].getAttribute("id")).slider('values',  0, localStorage.getItem(range_sliders[i].getAttribute("id") + '_min'));
            $('#' + range_sliders[i].getAttribute("id")).slider('values',  1, localStorage.getItem(range_sliders[i].getAttribute("id") + '_max'));
            $('#' + range_sliders[i].getAttribute("id")).slider('refresh');
        }
    }
});

在PHP文件中使用滑块，如下所示：

<label>Price range:</label>
<input type="text" name="this_slider1" readonly style="border:0; color:#f6931f; font-weight:bold;">

<div id="this_slider1" class="slider-range"></div>
<br>


<label>Price range:</label>
<input type="text" name="this_slider2" readonly style="border:0; color:#f6931f; font-weight:bold;">

<div id="this_slider2" class="slider-range"></div>
<br>

而不是

$('#' + range_sliders[i].getAttribute("id")).slider('values',  0, localStorage.getItem(range_sliders[i].getAttribute("id") + '_min'));
$('#' + range_sliders[i].getAttribute("id")).slider('values',  1, localStorage.getItem(range_sliders[i].getAttribute("id") + '_max'));

但所有这些都不起作用。我哪里有错。我认为错误就在这几排

$('#' + range_sliders[i].getAttribute("id")).slider('values',  0, localStorage.getItem(range_sliders[i].getAttribute("id") + '_min'));
$('#' + range_sliders[i].getAttribute("id")).slider('values',  1, localStorage.getItem(range_sliders[i].getAttribute("id") + '_max'));

因为如果我在它们之前和之后添加警报，只会显示之前的警报。你有什么想法吗

谢谢

找到了答案：

$( document ).ready(function() {
    var range_sliders = document.getElementsByClassName("slider-range");
    for (i = 0; i < range_sliders.length; i++) {
        if (localStorage.getItem(range_sliders[i].getAttribute("id") + '_min') != null){
            try {
                $('#' + range_sliders[i].getAttribute("id")).slider('values',  0, localStorage.getItem(range_sliders[i].getAttribute("id") + '_min'));
                $('#' + range_sliders[i].getAttribute("id")).slider('values',  1, localStorage.getItem(range_sliders[i].getAttribute("id") + '_max'));
                $('#' + range_sliders[i].getAttribute("id")).prev().val( localStorage.getItem(range_sliders[i].getAttribute("id") + '_min') + "-" + localStorage.getItem(range_sliders[i].getAttribute("id") + '_max') );
            }
            catch(err) {
                alert(err.message);
            }
        }
    }
});

节和调用选择器，如

$('#' + range_sliders[i].getAttribute("id")).slider

就这些。也许它将来会帮助其他人

$( document ).ready(function() {
});

$('#' + range_sliders[i].getAttribute("id")).slider