JS更改選擇選項由另一個腳本填充

Question

我使用數據庫中的腳本填充選擇選項表單。現在 我想要做的是，如果用戶更改選項示例選擇匹配1，然後我將在另一個PHP文件上運行一些東西，以填補匹配1中的細節div。 如果我不用腳本填充選擇選項它運行良好。雖然當我使用腳本的選項是正確的，但在變化沒有任何反應。在頭

function populateSelect(){ 
    var load = $.get('popRoundSel.php',{gameNo:"<?php echo $_POST['gameNo']; ?>"}); 
    $(".round").html('Refreshing'); 
    load.error(function() { 
     console.log("Mlkia kaneis"); 
     $(".round").html('failed to load'); 
     // do something here if request failed 
    }); 
    load.success(function(res) { 
     console.log("Success"); 
     $(".round").html('<select id="roundselect"><option>----</option>'+res+'</select>'); 
    }); 
    load.done(function() { 
     console.log("Completed"); 
    }); 
} 
$(document).ready(function() 
    { 
     $('#roundselect').change(function() 
     { 
      var selected = $(this).find(':selected').html(); 
      $.post('roundinfo_sc.php', {'beverage': selected}, function(data) { 
       $('#result').html(data); 
      }); 
     }); 
    }); 

頁代碼

<h2>Select a round to see more details</h2> 
<div class="round"> 
<script> 
populateSelect(); 
</script> 
</div> 
<div id="result">  
</div> 

Answer 1

好問題

JS是，當你添加新的選擇，你失去所有你綁定到該事件。

所以你應該把$('#roundselect').change(function()...負載更迭之類的函數在這裏面：

load.success(function(res) { 
     console.log("Success"); 
     $(".round").html('<select id="roundselect"><option>----</option>'+res+'</select>'); 
    $('#roundselect').change(function() 
     { 
      var selected = $(this).find(':selected').html(); 
      $.post('roundinfo_sc.php', {'beverage': selected}, function(data) { 
       $('#result').html(data); 
      }); 
     }); 

});