javascrip 動態下拉式選單 一動二

<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--
function select1_onchange(ele) {
var Target = document.form1.select2;
var Value = ele.options[ele.options.selectedIndex].value;

//先將選項清空
for(var i=0;i< Target.options.length;i++ ){
Target.options[i]=null;
}
switch (Value) {
case '1' :
var labels = new Array("A","B","C");
                         //將新選項填入
for(var i = 0; i < labels.length; i++){
var newOption=new Option(labels[i],i);
                                /*另一種寫法
                                    var newOption=new Option;
                                     newOption.value=Value+"."+(i+1);
                                      newOption.text=Value+"."+(i+1);
                                */
if(i==0){
newOption.selected=true; //如果沒有這一句，則在NS4.5中，會是空白選項為預設選項。
}
document.form1.select2.options[i]=newOption;
}
break;
case '2' :
var labels = new Array("W","Q","R");
for(var i = 0; i < labels.length; i++){
var newOption=new Option(labels[i],i);
if(i==0){
newOption.selected=true; //如果沒有這一句，則在NS4.5中，會是空白選項為預設選項。
}
document.form1.select2.options[i]=newOption;
}
break;
}
}
function select2_onchange(ele) {
        document.form1.text1.value=ele.options[ele.selectedIndex].value
}









<FORM action="" method=POST id=form1 name=form1 >
<SELECT id="select1" name="select1" LANGUAGE=javascript onchange="return select1_onchange(this)">
<OPTION value="1">1</OPTION>
<OPTION value="2">2</OPTION>
</SELECT>
<SELECT id=select2 name=select2 LANGUAGE=javascript onchange="return select2_onchange(this)">
<OPTION value="0">A</OPTION>
<OPTION value="1">B</OPTION>
<OPTION value="2">C</OPTION>
</SELECT><INPUT type="text" id=text1 name=text1 size=3></FORM>











參考資料:
http://www.programmer-club.com/showSameTitleN/javascript/2197.html
http://www.dotblogs.com.tw/jellycheng/archive/2010/12/17/20215.aspx

http://www.w3schools.com/php/php_ajax_database.asp    AJAX (javascript 更動 SQL資料)
http://stackoverflow.com/questions/15605189/mysql-query-within-javascript