<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