JQuery ui滑塊不允許發佈兩個diff。滑塊值在同一個FORM？

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）。