无限级联select,
将以下两个文件,存到一个目录下,可以看到效果JK注:
1.仅通过IE6.0测试
2.在看明白每一行代码的用途前,请不要使用本代码。--------SelectAndSubSelect.htm----------
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JK:支持民族工业,尽量少买X货</title>
<style>
select
{
width:120px;
}
</style>
<script language=javascript>/**
* This function is to set options to subSelect.
* JK 2003-12-08
* obj: parentSelect , it should have these attributes:subSelect(name of subSelect).
* noChangeSubsOfSubSelect: if you don't want to set the subSelects of subSelect, the arg is true.
*/
function parentSelectChangeFun(obj,noChangeSubsOfSubSelect)
{
if(obj.subSelect==null || obj.subSelect=="") return false;
var tempSubSelect=document.all(obj.subSelect);
if(tempSubSelect==null) return false;
tempSubSelect.length=1;
if( !noChangeSubsOfSubSelect ) parentSelectChangeFun(tempSubSelect);
if(obj.value==null || obj.value=="") return false;
var theXmlHttp = new ActiveXObject( "Microsoft.XMLHTTP" );
var theUrl="GetSubSelectOptions.htm?codeTable="+obj.subCodeTableName+"&foreignKey="+obj.subCodeTableForeignKey+"&foreignKeyValue="+obj.value;
//alert("Get subselect's options with this url:\n"+theUrl);
theXmlHttp .open( "get", theUrl, false );
theXmlHttp .send();
eval(theXmlHttp.responseText);
}</script>
<script language=javascript > function fixHistory() //记住历史
{
document.all("theHistoryRecord").value=document.all("pageContentDiv").innerHTML;
} function historyOncemore()
{
if (document.all("theHistoryRecord").value!="")
{
//恢复历史:例如存盘失败后,当页面返回到本页时,恢复成上次离开页面时的值。
document.all("pageContentDiv").innerHTML=document.all("theHistoryRecord").value;
}
else
{
// these code is to set options to subSelect when the parentSelect has defaultValue;
allSelect=document.getElementsByTagName("select");
for(var i=0;i<allSelect.length;i++)
{
if( allSelect[i].subSelect==null || allSelect[i].subSelect=="") continue;
parentSelectChangeFun(allSelect[i],true);
var tempSubSelect=document.all(allSelect[i].subSelect);
tempSubSelect.value=tempSubSelect.defaultValue;
}

}
} window.onbeforeunload = fixHistory;
window.onload=historyOncemore;
</script>
</head><body><form name=frm action="about:结果页面">
<div id=pageContentDiv>
JK的无限级联select示例.<br>
<select name=a onchange="parentSelectChangeFun(this)" subSelect="b" subCodeTableName="CodeTable_b" subCodeTableForeignKey="column_a" >
<option value="">
<option value=1 selected >1
</select><br>
<select name=b defaultValue="2" onchange="parentSelectChangeFun(this)" subSelect="c" subCodeTableName="CodeTable_c" subCodeTableForeignKey="column_b" >
<option value="">
</select><br>
<select name=c defaultValue="3" >
<option value="">
</select><br>
<br>
<br>
<select name=aa onchange="parentSelectChangeFun(this)" subSelect="bb" subCodeTableName="CodeTable_bb" subCodeTableForeignKey="column_aa" >
<option value="">
<option value=1>1
</select><br>
<select name=bb onchange="parentSelectChangeFun(this)" subSelect="cc" subCodeTableName="CodeTable_cc" subCodeTableForeignKey="column_bb">
<option value="">
</select><br>
<select name=cc onchange="parentSelectChangeFun(this)" subSelect="dd" subCodeTableName="CodeTable_dd" subCodeTableForeignKey="column_cc">
<option value="">
</select><br>
<select name=dd onchange="parentSelectChangeFun(this)" subSelect="ee" subCodeTableName="CodeTable_ee" subCodeTableForeignKey="column_dd">
<option value="">
</select><br>
<select name=ee >
<option value="">
</select><br>
</div>
<input type=submit value=Submit >
</form><textarea name="theHistoryRecord" style="display:none;" rows="1" cols="20" ></textarea></body></html>
--------SelectAndSubSelect.htm----------
tempSubSelect.add(new Option("1","1"));
tempSubSelect.add(new Option("2","2"));
tempSubSelect.add(new Option("3","3"));
tempSubSelect.add(new Option("4","4"));