1

時刻が午前 12 時から午後 11 時 45 分までの 2 つの選択要素があります。

どちらの選択にも、テキストと値を含む同じオプションがあります。たとえば、最初の選択で午後 1:00 を選択して、2 番目の選択で午後 1:00 の前にすべてのオプションを削除することは可能ですか? jqueryで変更を検出できることを知っています

$('#select1').change(function(){

// in here do something to remove previous selects

});

どんな助けでも大歓迎です。

4

4 に答える 4

1

これは、ユーザーが最初の選択を変更し、2 番目の選択を正しくフィルタリングできるようにする、同じバージョンの別のバージョンです。

$(document).ready(function() {
  var to_mins = function(x) {
    var p = x.split(':').map(function(v) { return parseInt(v, 10); });
    return (p[0] * 60) + p[1];
  };
  $('#second').data('options', $('#second').find('option').toArray());
  $('#first').change(function() {
     var val = to_mins(this.value);
     console.log(val);
     $('#second').empty();
     $('#second').data('options').filter(function(v) {
       return to_mins(v.value) > val;
     }).map(function(v) {
       $('#second').append(v.cloneNode(true));
     });
  });
});
于 2013-04-18T06:08:12.753 に答える
1

試す

$('#select1').change(function(){
    var $this = $(this);
    var index = $('option:selected', $this).index();
    $('#select2 option').show().filter(':lt(' + index + ')').hide();
})

デモ:フィドル

于 2013-04-18T06:08:20.897 に答える
0

HTML:

<select id="select1">
  <option value="1">11h00</option>
  <option value="2">11h15</option>
  <option value="3">11h30</option>
  <option value="4">11h45</option>
  <option value="5">12h00</option>
  <option value="6">12h15</option>
  <option value="7">12h30</option>
  <option value="8">12h45</option>
  <option value="9">13h00</option>
</select>

<select id="select2">
   <option value="1">11h00</option>
  <option value="2">11h15</option>
  <option value="3">11h30</option>
  <option value="4">11h45</option>
  <option value="5">12h00</option>
  <option value="6">12h15</option>
  <option value="7">12h30</option>
  <option value="8">12h45</option>
  <option value="9">13h00</option>
</select>

JS:

$(document).ready( function(){
  $('#select1').change(function(){
    var val = $(this).find('option:selected').prop('value');

    $('#select2').find('option').show().each(function(){
      if( $(this).prop('value') <= val ){
        $(this).hide();
      }
      else{
        return false;
      }
    });
  });
});
于 2013-04-18T06:00:28.533 に答える