php - 如何动态更改 jquery ui slider 的最小值、最大值？

Question

所以我有一个页面，上面有一个 jquery ui slider ，初始化如下:

var min = $("#attrInformation").data("lowest_price"),
max = $("#attrInformation").data("highest_price");

    $( "#slider-range" ).slider({
        range: true,
        min: min,
        max: max,
        values: [ min, max ],
        slide: function( event, ui ) {
            var start = ui.values[0],
            end = ui.values[1];

            $("#startPrice").text(start);
            $("#endPrice").text(end);
        },
        stop: function(event,ui){
            var start = ui.values[0],
            end = ui.values[1];

            refineObject.price_min = start;
            refineObject.price_max = end;

            refineResults(refineObject);
        }
    });

并且我希望能够根据 ajax 调用的结果更改两个句柄所针对的最小值、最大值和值。所以我尝试过这样的事情:

    $.get("ajax.php",options,function(data){
    $('.middle_container').html(data);          

    $('#slider-range').slider( "option", "min", $('.middle_container').find('.start_price').val() );
    $('#slider-range').slider( "option", "max", $('.middle_container').find('.end_price').val() );
    $('#slider-range').slider("value", $('#slider-range').slider("value"));

        });

我的最小值和最大值包含在两个隐藏的 div 中，类为 start_price 和 end_price。这目前不起作用，它不会更新最高价格，并且 slider 的右 handle 出现在左侧的位置之外。关于如何进行这项工作的任何建议？我正在为后端使用 php。 start_price 和 end_price 代码有效且正确。

Answer 1

确保 $('.middle_container').find('.start_price').val() 和 $('.middle_container').find('.end_price') .val() 正在返回正确的值。此外，要设置 slider 的值，您必须使用与设置最小/最大值相同的语法。还有

试试这个

$.get("ajax.php",options,function(data){
    $('.middle_container').html(data);          

    $('#slider-range').slider( "option", "min", $('.middle_container').find('.start_price').val() );
    $('#slider-range').slider( "option", "max", $('.middle_container').find('.end_price').val() );
    $('#slider-range').slider( "option", "value", $('#slider-range').slider("value"));

});