js两级联动_js二级联动下拉列表菜单

① js下拉菜单出现Undefined，二级联动菜单出错

中括号之间的逗号不能省略
例如['0601 工业用地', '0602 采矿用地', '0603 盐田', '0604 仓储用地'] ['0701 城镇住宅用地', '0702 农村宅基地']两个 ][ 之间要加英文逗号

② JS 二级联动页面问题

修改后的JSP代码如下：

<%@pagelanguage="java"contentType="text/html;charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8">
<linkrel="stylesheet"type="text/css"href="CSS/css_style.css"/>
<title>恒丰银行昆明分行外部评级机构管理系统</title>
</head>
<script>
vararr=newArray();
arr[0]="昆明市,五华区,盘龙区,官渡区,西山区,东川区,呈贡县,晋宁县,富民县,宜良县,石林彝族自治县,嵩明县,禄劝彝族苗族自治县,寻甸回族彝族自治县,安宁市";
arr[1]="曲靖市,麒麟区,马龙县,陆良县,师宗县,罗平县,富源县,会泽县,沾益县,宣威市";
arr[2]="玉溪市,红塔区,江川县,澄江县,通海县,华宁县,易门县,峨山彝族自治县,新平彝族傣族自治县,元江哈尼族彝族傣族自治县";
arr[3]="昭通市,昭阳区,鲁甸县,巧家县,盐津县,大关县,永善县,绥江县,镇雄县,彝良县,威信县,水富县";
arr[4]="丽江市,隆阳区,施甸县,腾冲县,龙陵县,昌宁县";
arr[5]="普洱市,古城区,玉龙纳西族自治县,永胜县,华坪县,宁蒗彝族自治县";
arr[6]="临沧市,翠云区,普洱哈尼族彝族自治县,墨江哈尼族自治县,景东彝族自治县,景谷傣族彝族自治县,镇沅彝族哈尼族拉祜族自治县,江城哈尼族彝族自治县,孟连傣族拉祜族佤族自治县,澜沧拉祜族自治县,西盟佤族自治县";
arr[7]="德宏市,临翔区,凤庆县,云县,永德县,镇康县,双江拉祜族佤族布朗族傣族自治县,耿马傣族佤族自治县,沧源佤族自治县";
arr[8]="瑞丽市,潞西市,梁河县,盈江县,陇川县";
arr[9]="泸水县,福贡县,贡山独龙族怒族自治县,兰坪白族普米族自治县";
arr[10]="香格里拉县,德钦县,维西傈僳族自治县";
arr[11]="大理市,漾濞彝族自治县,祥云县,宾川县,弥渡县,南涧彝族自治县,巍山彝族回族自治县,永平县,云龙县,洱源县,剑川县,鹤庆县";
arr[12]="楚雄市,双柏县,牟定县,南华县,姚安县,大姚县,永仁县,元谋县,武定县,禄丰县";
arr[13]="个旧市,开远市,蒙自县,屏边苗族自治县,建水县,石屏县,弥勒县,泸西县,元阳县,红河县,金平苗族瑶族傣族自治县,绿春县,河口瑶族自治县";
arr[14]="文山县,砚山县,西畴县,麻栗坡县,马关县,丘北县,广南县,富宁县";
arr[15]="景洪市,勐海县,勐腊县";

functioninit(index){
varcity=document.getElementById("city_"+index);
varcityArr=arr[0].split(",");
for(vari=0;i<cityArr.length;i++){
city[i]=newOption(cityArr[i],cityArr[i]);
}
}

functiongetCity(comp){
	//获得控件序号（1..*）
	varindex=comp.id.charAt(comp.id.length-1);
	varprovince=document.getElementById("province_"+index);
varcity=document.getElementById("city_"+index);
varcityArr=arr[province.selectedIndex].split(",");

city.length=0;
//将城市数组中的值填充到城市下拉框中
for(vari=0;i<cityArr.length;i++){
city[i]=newOption(cityArr[i],cityArr[i]);
}
}
</script>
<script>
functiondisplayResult(){
vartable=document.getElementById("table-7");
varrows=table.rows.length;
varcurrRow=rows-1;
varrow=table.insertRow(currRow);
varcell1=row.insertCell(0);
varcell2=row.insertCell(1);
varindex=currRow-2;

cell1.innerHTML="+抵押物";
cell2.innerHTML="抵押物证号：<inputname='clot_no_"+index+"'><inputtype='button'value='+'onClick='displayResult();'><br/>"
		+"抵押物归属地:"
		+"<selectid='province_"+index+"'size=1onchange='getCity(this)'>"
		+"<optionvalue=0>昆明</option>"
		+"<optionvalue=1>曲靖</option>"
		+"<optionvalue=2>玉溪</option>"
		+"<optionvalue=3>昭通</option>"
		+"<optionvalue=4>保山</option>"
		+"<optionvalue=5>丽江</option>"
		+"<optionvalue=6>普洱</option>"
		+"<optionvalue=7>临沧</option>"
		+"<optionvalue=8>德宏</option>"
		+"<optionvalue=9>怒江</option>"
		+"<optionvalue=10>迪庆</option>"
		+"<optionvalue=11>大理</option>"
		+"<optionvalue=12>楚雄</option>"
		+"<optionvalue=13>红河</option>"
		+"<optionvalue=14>文山</option>"
		+"<optionvalue=15>版纳</option>"
		+"</select>"
		+"<selectid='city_"+index+"'style='width:auto'></select><br/>"
		+"抵押物地址：<inputname='clotaddr"+index+"'>";
		
		init(index);
}
</script>

<bodyonload="init(1)">
<divid="wrapper">
<headerclass="SiteHeader"><imgsrc="PIC/HF_LOGO.png"
alt="HFKM-KJB"style="width:89px;height:34px;"></header>

<asideclass="NavSidebar"><nav>
<h2>当前用户</h2>
<ul>
<li>用户名：</li>
<li>角色：</li>
</ul>
</nav><nav>
<h2>功能导航</h2>
<ul>
<%
Stringmana_type=session.getAttribute("mana_type").toString();
Stringmenu="";
if(mana_type.equals("系统管理员")){
menu="<li><ahref="showOrg.do">查看评估机构</a></li><li><ahref="CreateOrg.jsp">新增评估机构</a></li><li><ahref="showPle_done.do">查看已抽签抵押物</a></li><li><ahref="showPle.do">查看未抽签抵押物</a></li><li><ahref="showPle.do">抽签结果查看</a></li>";
}else
{
menu="<li><ahref="showOrg.do">查看评估机构</a></li><li><ahref="showPle_done.do">查看已抽签抵押物</a></li><li><ahref="showPle.do">查看未抽签抵押物</a></li><li><ahref="CreatePle.jsp">新增抵押物</a></li><li><ahref="showPle.do">抵押物抽签</a></li>";

}
%>
<%=menu%>
</ul>
</nav><section>
<h2>系统设置</h2>
<ul>
<li><ahref="">修改密码</a></li>
<li><ahref="logout.do">退出登录</a></li>
</ul>
</section><br/>
<br/>
<br/>
<br/>
</aside>

<main><articleclass="Content"><header
class="ArticleHeader"></header>
<h3align=center>新增业务信息</h3>
<br/>

<formname="frmCrePle"action="CrePle.do">
<tableborder="1"id="table-7">
<tr>
<td>借款人名称</td>
<td><inputname="loan_na"></td>
</tr>
<tr>
<td>借款人身份证号/统一社会信用代码</td>
<td><inputname="loan_no"></td>
</tr>
<tr>
<td>抵押人名称</td>
<td><inputname="plg_na"></td>
</tr>
<tr>
<tdid="td_na_1">抵押物</td>
<tdid="clot_no">
抵押物证号：<inputname="clot_no_1"><inputtype="button"value="+"onClick="displayResult(this);"><br/>
抵押物归属地:
<selectid="province_1"size=1onchange="getCity(this)">
<optionvalue=0>昆明</option>
<optionvalue=1>曲靖</option>
<optionvalue=2>玉溪</option>
<optionvalue=3>昭通</option>
<optionvalue=4>保山</option>
<optionvalue=5>丽江</option>
<optionvalue=6>普洱</option>
<optionvalue=7>临沧</option>
<optionvalue=8>德宏</option>
<optionvalue=9>怒江</option>
<optionvalue=10>迪庆</option>
<optionvalue=11>大理</option>
<optionvalue=12>楚雄</option>
<optionvalue=13>红河</option>
<optionvalue=14>文山</option>
<optionvalue=15>版纳</option>
</select>
<selectid="city_1"style="width:auto"></select><br/>
抵押物地址：<inputname="clotaddr_1">
</td>
</tr>

<tralign="center">
<tdcolspan="2"><inputtype="submit"value="提交"></td>
</tr>
</table>
</form>

</article></main>

<footer>
<pclass="Disclaimer">
©2017恒丰银行昆明分行<br>DisignbyKJB-TianSIR
</p>
</footer>
</div>
</body>
</html>

③ 拷来JS二级联动，有几处看不懂

1.可能是为了兼容两种不同浏览器对ADD语法的不同
2.页面第一次加载后初始化城市下拉列

④ js二级联动下拉列表不显示里面的值

js二级联动下拉列表不显示里面的值，在二级下拉框中添加 @change 方法，方法体里调用 this.$forceUpdate() 方法

⑤ js二级联动下拉列表菜单

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>New Document </title>
<script language="JavaScript" type="text/javascript">

var city=[
["北京","天津","上海","重庆"],
["南京","苏州","南通","常州"],
["福州","福安","龙岩","南平"],
["广州","潮阳","潮州","澄海"],
["兰州","白银","定西","敦煌"]
];
function getCity(){
var sltProvince=document.getElementById("province");
var sltCity=document.getElementById("city");
var provinceCity=city[sltProvince.selectedIndex-1];
sltCity.length=1;
for(var i=0;i<provinceCity.length;i++){
sltCity[i+1]=new Option(provinceCity[i],provinceCity[i]);
}
}

</script>
</head>
<body>

<form action="somepage.asp" name=theForm">
<select name="province" id="province" onchange="getCity()">
<option value="0">请选择所在省份</option>
<option value="直辖市">直辖市</option>
<option value="江苏省">江苏省</option>
<option value="福建省">福建省</option>
<option value="广东省">广东省</option>
<option value="甘肃省">甘肃省</option>
</select>
<select id="city" name="city">
<option value="0">请选择所在城市</option>
</select>
</form>
</body>
</html>

导航:首页 > 编程语言 > js两级联动

js两级联动

与js两级联动相关的资料

友情链接