小弟現在有一個問題就是如何更新下拉選單用AJAX來完成。
程式碼一
selectcolor.php
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<script>
$(document).ready(function(){
$('.upperchangeColor').change(function(e) {
var cid = $(this).attr("popupid");
alert(cid);
});
$('#test1').click(function() {
$.ajax({
type: "GET",
url: "test123.php",
success: function(R){
$('#table-1').fadeOut(1000, function() {
$(this).html(R);
$(this).fadeIn(500);
});
}
});
});
});
</script>
</head>
<table border="0px" id="table-1" width="75%"><tr id="upperRow0"> <td style="padding:0px" colspan="3" bgcolor="F0F8FF">
<select class="upperchangeColor" name="upperchangeColor0" id="color0" popupid="0">
<option value="default">default</option>
<option value="blue">blue</option>
<option value="black">black</option>
<option value="chocolate">chocolate</option>
<option value="darkgreen">darkgreen</option>
<option value="firebrick">firebrick</option>
<option value="gray">gray</option>
<option value="magenta">magenta</option>
<option value="olive">olive</option>
<option value="purple">purple</option>
<option value="red">red</option>
</select>
</td></tr></table>
<input type="button" id="test1" value="TEST">
</html>
程式碼二是
test123.php
<?php
echo <<< UUU
<select class="upperchangeColor" name="upperchangeColor0" id="color0" popupid="0">
<option value="default">default</option>
<option value="blue">blue</option>
<option value="black">black</option>
<option value="chocolate">chocolate</option>
<option value="darkgreen">darkgreen</option>
<option value="firebrick">firebrick</option>
<option value="gray">gray</option>
<option value="magenta">magenta</option>
<option value="olive">olive</option>
<option value="purple">purple</option>
<option value="red">red</option>
</select>
UUU;
?>
現在的問題是在還沒按是TEST BUTTON的時候，當我去change下拉選單的時候它會跳出值是0，
但是當我按下TEST BUTTON的時候，我再去change下拉選單的時候它就沒有反應了。
請問這是為什麼的?
