簡體   English   中英

jQuery:使用數量滑條對更改的影響

[英]jQuery: Effect on change with Amount-Slider

我有一個表單設置,當選擇某些值時,我可以更改項目列表。

我有一個表格,其值是1到4年,選擇這些選項時,結果字段中的值會隨着調整的價格而變化。 使用此菜單時,一切正常。

現在,我已經安裝了一個滑塊( http://jqueryui.com/slider/#hotelrooms )並使其與菜單一起使用,但是jQuery的.change並沒有接受該滑塊對所做的更改。

正如您在這段腳本中所看到的:

<script>
  $(function() {
    var select = $( "#minbeds" );
    var slider = $( "<div id='slider' style='margin-left:30px;'></div>" ).insertAfter( "#reserverer" ).slider({
     min: 1,
     max: 4,
     range: "min",
     value: select[ 0 ].selectedIndex + 1,
     slide: function( event, ui ) {
       select[ 0 ].selectedIndex = ui.value - 1;
      }
    });
    $( "#minbeds" ).change(function() {
      slider.slider( "value", this.selectedIndex + 1 );
    });
  });
 </script>

它說的位: selectedIndex + 1,更改菜單,但這不會激活以下jQuery代碼:

<script>
$('#minbeds').change(function(){
    if($(#minbeds).val() == '2 Years'){ 
      $("#t_1_y_1").hide('slow');
      $("#t_1_y_2").show('slow');
      $("#t_1_y_3").hide('slow');
      $("#t_1_y_4").hide('slow');
    }
   });
</script>

滑塊正在運行,菜單正在運行,但是如何獲取滑塊以運行jQuery腳本?

在此先感謝您的幫助。

請嘗試以下方法:

   <script>
      $(function() {
        var select = $( "#minbeds" );
        var slider = $( "<div id='slider' style='margin-left:30px;'></div>" ).insertAfter( "#reserverer" ).slider({
         min: 1,
         max: 4,
         range: "min",
         value: select[ 0 ].selectedIndex + 1,
         slide: function( event, ui ) {
           select[ 0 ].selectedIndex = ui.value - 1;
            if(ui.value == '2') { 
              $("#t_1_y_1").hide('slow');
              $("#t_1_y_2").show('slow');
              $("#t_1_y_3").hide('slow');
              $("#t_1_y_4").hide('slow');
            }
          }
        });
        $( "#minbeds" ).change(function() {
          slider.slider( "value", this.selectedIndex + 1 );
           if($(this).val() == '2'){ 
             $("#t_1_y_1").hide('slow');
             $("#t_1_y_2").show('slow');
             $("#t_1_y_3").hide('slow');
             $("#t_1_y_4").hide('slow');
           }
        });


      });
     </script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM