0

選択肢が 2 つ未満の場合、選択ボックスを非表示にするにはどうすればよいですか? 選択ボックスにオプションを自動的に追加する小さなスクリプトを作成しました。これはうまく機能します。ただし、問題は、表示するオプションがない場合でも、次の選択ボックスが表示されることです。それを修正する方法は？/////// の間のコードを自分で試してみました

HTML

  <div class="zoeken-select">
    <div class="zoeken-value" id="cat1">Selecteer je school/opleiding</div>
    <div class="zoeken-handle"></div>
    <select id="school" class="gui-validate">
      <option>Selecteer je school/opleiding</option>
                <option value="566342">Riemen</option>
                <option value="566347">Sjaals</option>
                <option value="566348">Tassen</option>
                <option value="566341">Kleding</option>
                <option value="566345">Sale!</option>

    </select>
  </div>
  <div class="zoeken-select course">
    <div class="zoeken-value" id="cat2">Selecteer je sector/locatie</div>
    <div class="zoeken-handle"></div>
    <select id="course" class="gui-validate">
    </select>
  </div>
  <div class="zoeken-select list" style="display:none;">
    <div class="zoeken-value" id="cat3"></div>
    <div class="zoeken-handle"></div>
    <select id="list" class="gui-validate">
    </select>
  </div>
  etc....

Jクエリ

// opleiding
            var courseSelection = {
             "566342": [ { value: "566343", text: "Dames riemen" },{ value: "566344", text: "Heren riemen" },],
             "566347": [ ],
             "566348": [ ],
             "566341": [ ],
             "566345": [ { value: "566346", text: "Tassen" },],

             };

            $("select#school").change(function(){

              $("select#course").html('<option value="">Kies je opleiding</option>');
              $("select#list").html('<option value="">Kies een lijst</option>');

              $("#cat1").html($("#school option:selected").text());
              $("#cat2").html('Kies je opleiding');
              $("#cat3").html('Kies een lijst');
              $("#cat4").html('Kies ');
              $("#cat5").html('Kies lijst');

              var options = '',
                  courses = courseSelection[$(this).val()];

              $('select#course').empty();

              options += '<option value="">Kies je opleiding</option>';

              $.each(courses, function() {
                options += '<option value="' + this.value + '">' + this.text + '</option>';
              });

              $('select#course').append(options);
              $('.zoeken-select.course').fadeIn(300);

            });
            // end opleiding

            // lijst
            var listSelection = {
               "566343": [ ],
               "566344": [ { value: "707274", text: "tyesr" },],
               "566346": [ ],
            };

            $("select#course").change(function(){

              $("#cat2").html($("#course option:selected").text());

              var options = '';
              lists = listSelection[$(this).val()];

              $('select#list').empty();

              options += '<option value="">Kies je lijst</option>';

              $.each(lists, function() {
                options += '<option value="' + this.value + '">' + this.text + '</option>';
              });

              $('select#list').append(options);

              ///////////////////////////////////////////
              if ( $("select#list option[value='" + options + "']").val() <= 2) { 
                $('.zoeken-select.list').hide();
              } else {
                $('.zoeken-select.list').show();
              }
              //////////////////////////////////////////
            });    
            etc...
4

2 に答える 2

1

hide()を次のように使用します。

if ( $("select#list option").length <= 2) { //check length of options not value
    $('.zoeken-select.list').hide();// use hide() in place of show()
} else {
    $('.zoeken-select.list').show();
}
于 2013-11-12T15:41:16.583 に答える