Question

我在同一个功能上使用两个不同的滑块（也尝试了不同的功能）（请参阅下面的代码）当表单发布时，我只获得一个滑块值，如何删除冲突？

$(function() {
        var t_select = $( "#taste_val1" );
        var slider = $( "<div id='type_slider'></div>" ).insertAfter( t_select ).slider({
            min: 1,
            max: 2,
            range: "max",
            value: t_select[ 0 ].selectedIndex + 1,
            slide: function( event, ui ) {
                t_select[ 0 ].selectedIndex = ui.value - 1;
            }
        });
        $( "#taste_val1" ).change(function() {
            type_slider.slider( "value", this.selectedIndex + 1 );
        });

        var d_select = $( "#taste_val2" );
        var slider = $( "<div id='dist_slider'></div>" ).insertAfter( d_select ).slider({
            min: 1,
            max: 5,
            range: "min",
            value: d_select[ 0 ].selectedIndex + 1,
            slide: function( event, ui ) {
                d_select[ 0 ].selectedIndex = ui.value - 1;
            }
        });
        $( "#taste_val2" ).change(function() {
            dist_slider.slider( "value", this.selectedIndex + 1 );
        });
    });

FORM CODE 1st Selector:
 <td width="65%" valign="top"> 
    <form id="reservation">
    <select name="taste_val1" id="taste_val1" style="display:none;">
        <option value="1">1</option>
        <option value="2">2</option>
    </select>
</form></td>

2nd SELECTOR:
   <td width="65%" valign="top"> 
    <form id="search">
        <select name="taste_val2" id="taste_val2" style="display:none;">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
        </select>
    </form>
    </td>

请，有人吗？

Answer 1

也许我读错了，但不应该

var slider = $( "<div id='type_slider'></div>" )

是

var type_slider = $( "<div id='type_slider'></div>" )

（与dist_slider类似）。

JQuery ui滑块不允许发布两个差异。相同FORM上的滑块值？

1 个答案: