0

特定の値が選択されたときにアイテムの値のリストが変更されるように設定されたフォームがあります。

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 スクリプトを実行するにはどうすればよいですか?

助けてくれてありがとう。

4

1 に答える 1

0

これを試してください：

   <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>
于 2013-04-23T16:13:58.873 に答える