1

jquerymobileで州と都市の依存ドロップダウンリストを作成しています。それは私のために働いていません。2番目のドロップダウンも非表示にできません。私が使用しているコードは次のとおりです。

html：

     <select name="selectmenu5" id="selectmenu5">
     <option value="0">Select State</option>   
     <option value="1">Andaman and Nicobar</option>  
     <option value="2">Andhra Pradesh</option>  
</select>

        <select name="selectmenu4" id="selectmenu4">
          <option class="city" id="1">Select City</option>
          <option class="city" id="2">option 2</option>
          <option class="city" id="3">Option 3</option>
    </select>

とjs：

    $(document).ready(function() {
        $("#selectmenu4").hide();
    $("#selectmenu5").live("change",function() {
       $("#selectmenu4").show();
        switch($("#this").val()){ 
            case "1":
                $(".city").hide().parent().find("#1").show();
                break;
            case "2":
                $(".city").hide().parent().find("#2").show();
                break;

        }
    });
});
4

1 に答える 1

1

これは、あなたの望むことですか？jsFiddle： http: //jsfiddle.net/WXbbj/40/

すべての選択を作成します。

<select name="selectmenu5" id="selectmenu5">
 <option value="0">Select State</option>   
 <option value="1">Andaman and Nicobar</option>  
 <option value="2">Andhra Pradesh</option>  


    <select class='cityList' name="selectmenu1" id="selectmenu1">
      <option class="city" id="0">Select City</option>
      <option class="city" id="1">city1</option>
      <option class="city" id="2">city2</option>
</select>

 <select class='cityList' id="selectmenu2">
      <option class="city" id="0">Select City</option>
      <option class="city" id="1">city3</option>
      <option class="city" id="2">city4</option>
</select>

基本的に私はcssを使用して「selectmenu」を非表示にします：

#selectmenu1,#selectmenu2{
display:none;
}

そして、これは正しいオプションのみを表示するjquery関数です。

 $(document).ready(function() {         
  $("#selectmenu5").on("change",function() {        
  $(".cityList").hide();         


  $("#selectmenu"+$(this).val()).show();
 }); });
于 2012-06-19T12:20:02.333 に答える