如何更改<option>第三<select>基於第二<select>，其中第二是通過更改第一下拉值使用jquery ajax

Question

我的項目（爲學校管理），並找不到奇怪的情況下繪製，找不到在互聯網上的一個合適的解決方案。這裏有問題， 我有三個<select>元素，第一個是選擇班級，第二個是選擇該班級的班級，第三個是從該班級選擇班級。代碼如下

<select id="class"> 
    <option value="class1">Class 1</option> 
    <option value="class2">Class 2</option> 
</select> 


<select id="section"> 
    <!--sections will be drawn here from database using ajax, based on class selected in 1st dropdown--> 
</select> 


<select id="course"> 
    <!--when a section is selected in 2nd dropdown, courses of that section will be drawn here from database using ajax--> 
</select> 

我的AJAX代碼繪製變化#class是繼時#section，它只是把選定的類別，並將其發送到draw_sections.php，在這裏我使用$ _GET []，以獲取其值並在查詢中用它來從數據庫中選擇該類的部分

$("#class").change(function(){ 
    var class = $(this).val(); 
    $.ajax({ 
     url: "draw_sections.php?class="+class+"", success: function(sections) { 
     $("#section").html(sections); 
     } 
    }); 
}); 

直到這一點，它工作正常，並繪製選定類的部分。現在我想在第二個<select>中選擇一個部分時，在第三個下拉課程<select>中繪製課程。這裏是我的ajax Ajax代碼

$("#section").change(function(){ 
     var section = $(this).val(); 
     $.ajax({ 
      url: "draw_courses.php?section="+section+"", success: function(courses) { 
      $("#course").html(courses); 
      } 
     }); 
    }); 

該功能的目的是採取部分（就像在課堂上所做的那樣），以draw_course.php和數據庫，然後把它收回去第三下拉該部分的選擇課程（因爲它在第一次下降，即上課） 但問題是因爲部分通過ajax繪製，選擇一個部分不會影響課程下拉。源代碼中也不存在這些部分。因爲我是ajax的初學者，所以無法更好地解釋我的問題。

Answer 1

你需要使用自select箱要麼delegate或on是建立動態

$("body").delegate('#section','change',function(){ 
    //code 
}); 

或者

$("#section").on('change',function(){ 
//code 
});