jqueryを使って選択ボックスを動的に埋め込む問題

Question

jqueryを使用してselect要素を動的に作成し、変更イベントが発生したときにアクションを作成したい。つまり、ユーザーが前の選択ボックスからオプションを選択したときに別の選択ボックスに入力したいとします。 最初の選択ボックスが（完全に）動的に（動的に埋め込まれているだけではなく）作成されたため、コードが機能しませんでした。私は静的な選択ボックスを作成し、それを動的に充填しようとしました。このコンボボックスからオプションを選択すると、別のコンボボックスを埋めます。このコードは正しく動作します。 私の場合は、select要素を動的に作成する必要があります。私は問題を知っているが、私はそれを修正する方法を知らない。 私はこのコードを書いた：

$(document).ready(function(){ 

$("a.package").click(function(){ 

     var id = $(this).attr('id'); 
     var parameters = {"privPackage":id}; 
     $.getJSON("InquirerManagmentServlet", parameters, function (result){ 
      //alert('get param'); 
      var data = result[0]; 
      var cities = result[1]; 
      var semester = result[2]; 
      var college = result[3]; 

      for (var i = 0; i < data.length; i++) { 
       var privNo = data[i]["privNo"]; 
       var privName; 
       var input; 
       if (privNo == 302){ 
        if(college !== null && college.length){ 
         input = $('<select name = "'+privNo+'" id ="collegeEName">'); 
         $('>option',input).remove(); 
         input.append($('<option >').val(0).text("choose ..")); 
         for(var j=0; j<college.length; j++){ 
          var option = $('<option />'); 
          option.attr("value",college[j]["collegeNo"]); 
          option.text(college[j]["collegeEName"]); 
          input.append(option); 
         } 
        } 
       } else if(privNo == 308){ 
        // 
       } 
       $("div#InfoToValidate").append(input); 
      } 
     }); 
}); 

// fill second combo boxes 
$("select").change(function(){ 
    alert("heey"); 
    var id = $(this).attr('id'); 
    if(id == "collegeEName"){ 
     var collegeNo = $(this).val(); // .text(); 
     var parameter = { 
      "collegeNo":collegeNo 
     }; 
     $.getJSON("InquirerManagmentServlet", parameter, function (departments){ 
      //var neighborhoods = result 
      var idSecond = "departmentEName"; 
      $('>option',$("select#"+idSecond+"")).remove(); 
      $("select#"+idSecond+"").append($('<option/>').text("")); 
      for(var j=0; j<departments.length; j++){ 
       $("select#"+idSecond+"").append($('<option value = "'+departments[j]["departmentNo"]+'"/>').text(departments[j]["departmentEName"])); 
      } 
     }); 
    } 
    // the rest of code 
}); 

}）;

誰かが私を助けてくれますか？

Answer 1

DOMがすでにロードされた後、あなたのselect要素を作成しているので、あなたは将来、証明などliveやdelegateのような結合方法を使用する必要があります。

変更

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

へ

$("select").live('change',function(){