2.选中第一个下拉框的任意一个值，同时第三个下拉框的值跟着改变，显示对应的数据。
ps:what?光动态添加就足以。。。。赋值还不能直接赋，而是添加下拉时就赋值。。。。。经过百般折磨，头发掉了n根，最终通过巧妙的思路解决了，在此记录下。若对你有所帮助，点赞加关注吧！后续及时更新。
第一个下拉选项显示
选择下拉项，同时加载数据到第三个下拉框
注：在这里直接去掉了第二行的标签
为了获取改变数据的行，试了很久，动态生成的下拉框无法获取到索引，所以才想到了使用id，并且给id后加一个数字
（1）var provs={}，存储省市的json结构数据。
（2）function loadProv() {}，此函数实现了初始化页面加载数据的功能。
（3）var prov = document.getElementById("prov")，获取存放省份的select下拉菜单。
（4）for (var key in provs)，遍历json结构数据。
（5）var provName = key，获取省份的名称。
（6）var optProv = document.createElement("option")，创建一个option元素对象。
（7）optProv.value = provName，设置option元素的value属性值。
（8）optProv.innerText = provName，设置option显示的文本内容。
（9）prov.appendChild(optProv)，将option元素添加到select下拉菜单。
（10）function provChange() {}，作为onchange事件处理函数。
（11）var prov = document.getElementById("prov"),获取省份下拉菜单。
（12）var city = document.getElementById("city"),获取城市下拉菜单。
（13）var provName = prov.value，获取当前选中的省份的value值。
（14）if (provName == "none") {
city.style.display = "none"
return
}，如果值等于none，说明选中的是第一项，那么城市下拉菜单还是具有隐藏状态，并跳出函数。
（15）else {
city.style.display = ""
},否则的话显示出城市下拉菜单，默认状态它是隐藏的。
（16）var citys = provs[provName]，获取城市，citys是个数组。
（17）for (var index = city.childNodes.length - 1index >= 0index--) {
var child = city.childNodes[index]
city.removeChild(child)
}，遍历城市下拉菜单下的option元素，然后删除这些元素。
之所以清空就是为了防止当再次加载的时候出现累加情况。
（18）for (var index = 0index <citys.lengthindex++) {}，遍历数组中的元素，也就是城市。
（19）var optCity = document.createElement("option")，创建option元素。
（20）optCity.value = citys[index]，设置option元素的value值。
（21）optCity.innerText = citys[index]，设置option元素的文本内容。
（22）city.appendChild(optCity)，将option元素添加select下拉菜单。
数据表形式数据
json形式数据
//获取下一级地区函数function getarea(level)
{ var getArea="/Area/GetNextLevelAJAX?identifier="
getArea+=$("#areaNamelevel"+level).val()
$("#"+$("#controlbox").val()).val($("#areaNamelevel"+level).val())
$("#selectareaname").html($("#areaNamelevel"+level+" option[@selected]").text())
$("#arealevel").val(level)
$.post(getArea,function(data){
data=data.split(',')
$("#divlevel"+(parseInt(data[0]))).empty()
//若无数据，不进行其它操作
if(data.length==1)
return true
//若viewarealevel的内容不为空，说明属性设置其显示地区级别
if($("#viewarealevel").html()!=null &&$("#viewarealevel").html()!="")
{
if(level==1)
$("#divlevel2").prepend("乡/镇:")
if(level==2)
$("#divlevel3").prepend("村/居委会:")
}
$("#divlevel"+(parseInt(data[0]))).append("<select id='areaNamelevel"+data[0]+"' onchange='javascript:getarea("+data[0]+")'></select><a id='divlevel"+(parseInt(data[0])+1)+"'></a>")
$("#areaNamelevel"+data[0]).append("<option value='0'>--请选择--</option>")
for(i=1i<data.lengthi=i+2)
{
$("#areaNamelevel"+data[0]).append("<option value="+"\""+data[i]+"\""+">"+data[i+1]+"</option>")
}
})
}
这个是限定到三级，无限级都可以
完整程序的带有很多程序中的个性，恐怕不合你要求，上面的函数是主要的取地区js函数，arealevelname*为select，divlevel*为<a></a>
布局如下
<a id=divlevel1><select id=arealevelname1></select><a id=divlevel2><select id=arealevelname2></select></a></a>
下面的函数是取地区代码段
public void GetNextLevelAJAX(int identifier)
{
string result = ""
Area area = business.SelectById<Area>(identifier)
result += area.AreaLevel + 1
List<Area>nextlevelareas = new List<Area>()
从数据库中取地区到nextlevelareas操作
foreach (Area nextlevelarea in nextlevelareas)
{
result += ','
result += nextlevelarea.Identifier
result += ','
result += nextlevelarea.AreaName
}
Response.Write(result)
}
这几个是页面上的隐含字段
<input type="hidden" id="arealevel" name="arealevel" value="" />
<input type="hidden" id="areaData" value="<%=this.AreaData%>" />
<input type="hidden" id="controlbox" value="<%=this.ControlBoxName%>" />
<input type="hidden" id="areastatus" name="areastatus" value="<%=this.ViewStatus%>" />
<input type="hidden" id="maxlevel" value="<%=this.MaxLevel%>" />
