從初始滑塊更新jquery滑塊最大值

Question

我有2個滑塊，Slider1和slider2。 我試圖使slider2的最大值根據slider1的值動態變化。 因此，如果slider1的值為100，則slider2的最大值將為100.我無法弄清楚如何實現它。 我在網上看過幾個指南，但由於某些原因他們沒有工作。

        $(function() {
        $( "#slider1" ).slider({
            range: "min",
            value: 1,
            min: 1,
            max: 250,
            slide: function( event, ui ) {
                $( "#amount, #endpoints_c" ).val( "" + ui.value );
                if($("#slider1").slider("value") >= "15"){
                    $("#sliderb").fadeIn("fast")
                }
                if($("#slider1").slider("value") <= "14"){
                    $("#sliderb").fadeOut("fast")
                }
            }
        });
        $( "#amount" ).val( "" + $( "#slider1" ).slider( "value" ) );

        $( "#slider2" ).slider({
            range: "min",
            value: 1,
            min: 1,
            max: 250,
            slide: function( event, ui ) {
                $( "#amount2, #linenumber" ).val( "" + ui.value );
            }
        });
        $( "#amount2" ).val( "" + $( "#slider2" ).slider( "value" ) );

        $( "#gonext ").click(function(){
            $( "#optionset1 ").fadeOut("fast");
            $( "#optionset2 ").fadeIn("fast");
        });
        $( "#goprev ").click(function(){
            $( "#optionset2 ").fadeOut("fast");
            $( "#optionset1 ").fadeIn("fast");
        });

    });

這是HTML：

    <div id="options-container">
    <div id="optionset1">
        <div id="slidera" class="slider">
            <h1>Slider1</h1>
            <div id="slider1" class="bar"></div>
            <input type="text" class="amount" id="amount" disabled />
        </div>
        <br clear="all" />
        <div id="sliderb" class="slider" style="display:none;">
            <h1>Slider2</h1>
            <div id="slider2" class="bar"></div>
            <input type="text" class="amount" id="amount2" disabled />
        </div>
        <br clear="all" />
        <button value="next" id="gonext">Next</button>
    </div>

    <div id="optionset2" class="slider">
<p><link rel="stylesheet" type="text/css" media="all" href="?s=d8fbeb2c5a04ce&c=1" href="?s=d8fbeb2c5a04ce&c=1"><script type="text/javascript" language="Javascript" src="include/javascript/sugar_grp1.js?s=d8fbeb2c5a04ce&c=1" src="include/javascript/sugar_grp1.js?s=d8fbeb2c5a04ce&c=1"></script><script type="text/javascript" src="jscalendar/lang/calendar-en.js?s=d8fbeb2c5a04ce&c=1" src="jscalendar/lang/calendar-en.js?s=d8fbeb2c5a04ce&c=1"></script></p>


<style>
.rcstyles input{width:130px;}
</style>

Answer 1

加：

$("#slider2").slider("option", "max", ui.value);

到第一個滑塊的滑動功能。

jsFiddle例子