开发--省级三联动,简单的代码,但是功能不差
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了开发--省级三联动,简单的代码,但是功能不差相关的知识,希望对你有一定的参考价值。
没什么好说的,不废话上代码,直接给select的上层DIV 添加 id="areaSelect “就可以了,是不是很方便呢,city.js的代码我下边贴下载链接
http://dl42.yunpan.360.cn/intf.php?method=Download.downloadFile&qid=574751937&fname=%2Fcity.zip&fhash=4754540ecf810ed5c7c01eea059e5ea4742558a5&dt=42_42.1d87f6e5349b0518e64409844fe93722&v=1.0.1&rtick=14561393801362&open_app_id=0&devtype=web&sign=ebaa65a8214b8b8b935d8bca293009c0&
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="areaSelect">
<select style="height: 36px;">
<option></option>
</select>
<select style="height: 36px;">
<option></option>
</select>
<select style="height: 36px;">
<option></option>
</select>
</div>
<script type="text/javascript" src="city.js" charset="gb2312"></script>
<script type="text/javascript">
//初始数据并绑定事件,不要忘记了charset="gb2312",否则显示不出来,全是显示的乱码
function areaSelect(node) {
var node = document.getElementById(node)
var selTag = node.getElementsByTagName(‘select‘),
arg = [];
for (var i = 0, j; j = selTag[i++];) {
arg.push(j.options[j.selectedIndex].text);
j.rel = i;
j.onchange = function() {
eventFun.call(area, this.rel, this.options[this.selectedIndex].text, selTag);
}
}
var area = new Areasel(selTag, arg[0] || ‘‘, arg[1] || ‘‘, arg[2] || ‘‘);
}
function eventFun(a, name, tag) {
switch (a) {
case 1:
this.area.getCity(name);
break;
case 2:
this.area.getDistrict(name);
break;
case 3:
return;
}
this.setHTML(a, tag)
}
var Areasel = function(tag, p, c, d) {
this.area = new getArea(p, c, d);
this.setHTML(0, tag);
}
Areasel.prototype.setHTML = function(a, tag) {
var name = [this.area.pName, this.area.cName, this.area.dName];
var dat = [this.area.pDat, this.area.cDat, this.area.dDat];
for (var i = a; i < tag.length; i++) {
tag[i].options.length = 0;
tag[i].add(new Option(this.area.text[i]));
this.createHTML(name[i], dat[i], tag[i]);
}
}
Areasel.prototype.createHTML = function(name, arr, tag) {
var temp;
for (var i = 0, j; j = arr[i++];) {
temp = new Option(j);
if (j == name) temp.selected = true;
tag.add(temp);
}
}
new areaSelect(‘areaSelect‘)
</script>
</body>
</html>
以上是关于开发--省级三联动,简单的代码,但是功能不差的主要内容,如果未能解决你的问题,请参考以下文章
代码片--实现一个简单的模版方法设计模式(获取一段程序运行的时间)