.toggle関数が正しく動作しない

Question

私は郡メニューを切り替えるために以下のスクリプトを使用していますが、ページ上に「イギリス」以外の国がロードされている場合に郡メニューを隠すようにしています。ページが読み込まれた後、別の国に問題があります。ページが読み込まれたときに「イギリス」が選択されていて、「郡」メニューがまだ表示されていない場合、別の国を最初に選択してから、ショーあなたが選択の選択値を取得する必要があり

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $(".selectWrapper").on("change", "select#country", function(){ 
      $("select.county").toggle($(this).val() == "United Kingdom"); 
     }); 
    }); 

    </script> 



    <script type="text/javascript"> 
    $(document).ready(function() { 
      if($("select.country") != "United Kingdom") { 
      $("select.county").toggle(); 
      } 
    }); 
    </script> 

Answer 1

2番目のif文には.val()のコールがありません。現在、jQueryオブジェクトとStringを比較しています。

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $(".selectWrapper").on("change", "select#country", function(){ 
      $("select.county").toggle($(this).val() == "United Kingdom"); 
     }); 
    }); 

    </script> 



    <script type="text/javascript"> 
    $(document).ready(function() { 
      if($("select.country").val() != "United Kingdom") { 
      $("select.county").toggle(); 
      } 
    }); 
    </script> 

Answer 2

、それはval()機能で行われます。

$(document).ready(function() { 
    if ($("select.country").val() != "United Kingdom") { 
     $("select.county").toggle(); 
    } 
});​ 

ところで、あなたは機能上でchangeのデリゲートイベントを作成している：

$(".selectWrapper").on("change", "select#country", 

あなたがする持っていないことをかなり確信して...

理由ではありません。

$("select#country").change(function(){ 
     $("select.county").toggle($(this).val() == "United Kingdom"); 
    }); 

Answer 3

初期状態が正しい取得し、変化に対応するために、これを使用します。

$(document).ready(function(){ 
    $(".selectWrapper").on("change", "#country", function(){ 
     $("select.county").toggle($(this).val() == "United Kingdom"); 
    }); 
    // set the initial state 
    $("select.county").toggle($("#country").val() == "United Kingdom"); 
}); 

これは、ページ読み込み時にオブジェクトが存在することを前提としています。まだ存在しない場合は、初期化コードがロードされた後、ある時点で初期化コードをトリガする必要があります。 がセレクタエンジンとして評価されるのが速ければ、"select#country"をセレクタとして使用する理由はないことに注意してください。

Answer 4

DOMの準備ができたら最初に切り替えて、適切な初期状態を設定します。次に、選択が変更されるたびに切り替えます。

Answer 5

2つのドロップダウン（ID付き1とクラス名を持つ1）あなたが行う可能性がある場合：

$(document).ready(function(){ 
    $(".selectWrapper").on("change", "select#country", function(){ 
     $("select.county").toggle($(this).val() == "United Kingdom"); 
    }); 
    $("select#country").trigger("change"); 
}); 

選択＃国が実行されるすべてのものを（行うために.triggerを使用してhttp://jsfiddle.net/x23nT/