如果不是,那么你的路径就写错了。
第二个如果你的city.js有直接去页面信息的,那么因为加载顺序的问题,就有可能取不到页面的元素信息。
说一下具体的错误吧。浏览器上是能看到javascript的错误的。不知道你用的是那种浏览器。
<script type="text/javascript" src="city.js"></script><select name="province" onChange="set_city(this, this.form.city)">
<option value="0">选择省</option>
<option value="北京市">北京市</option>
<option value="上海市">上海市</option>
<option value="天津市">天津市</option>
<option value="重庆市">重庆市</option>
<option value="河北省">河北省</option>
<option value="山西省">山西省</option>
...
</select>
<select name="city" id="citys" >
<option value="0">选择城市</option>
</select>
city.js文件:
cities = new Object()
cities['北京市']=new Array('北京市区', '北京市辖区')
cities['上海市']=new Array('上海市区', '上海市辖区')
cities['天津市']=new Array('天津市区', '天津市辖区')
cities['重庆市']=new Array('重庆市区', '重庆市辖区')
cities['中国台湾']=new Array('中国台湾')
cities['中国香港']=new Array('中国香港')
cities['中国澳门']=new Array('中国澳门')
cities['河北省']=new Array('石家庄', '张家口市', '承德市', '秦皇岛市', '唐山市', '廊坊市', '保定市', '沧州市', '衡水市', '邢台市', '邯郸市')
cities['山西省']=new Array('太原市', '大同市', '朔州市', '阳泉市', '长治市', '晋城市', '忻州地区', '吕梁地区', '晋中市', '临汾地区', '运城地区')
cities['辽宁省']=new Array('沈阳市', '朝阳市', '阜新市', '铁岭市', '抚顺市', '本溪市', '辽阳市', '鞍山市', '丹东市', '大连市', '营口市', '盘锦市', '锦州市', '葫芦岛市')
cities['吉林省']=new Array('长春市', '白城市', '松原市', '吉林市', '四平市', '辽源市', '通化市', '白山市', '延边朝鲜族自治州')
...
function set_city(province, city)
{
var pv, cv
var i, ii
pv=province.value
cv=city.value
city.length=1
if(pv=='0') return
if(typeof(cities[pv])=='undefined') return
for(i=0i<cities[pv].lengthi++)
{ ii = i+1
city.options[ii] = new Option()
city.options[ii].text = cities[pv][i]
city.options[ii].value = cities[pv][i]
}}
function cha(){
if (document.myform.u_username.value=="")
{
alert("用户名不能为空!")
}
else
{var str_cha = document.myform.u_username.value
location.href="cha.aspx?str=" + str_cha
}}
由于百度限制了输入字数,所以上面的省市我都没写全,你自己去修改就可以了
HTML首先在head中载入jquery库和cityselect插件。
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.cityselect.js"></script>
接下来,我们在#city中,放置三个select,并且三个select分别设置class属性为:prov、city、dist,分别表示省、市、区(县)三个下拉框。注意如果只想实现省市二级联动,则去掉第三个dist的select即可。
<div id="city">
<select class="prov"></select>
<select class="city" disabled="disabled"></select>
<select class="dist" disabled="disabled"></select>
</div>
jQuery
调用cityselect插件非常简单,直接调用:
$("#city").citySelect()
自定义参数调用,设置默认省市区。自定义参数调用,设置默认省市区。
$("#city").citySelect({
url:"js/city.min.js",
prov:"湖南", //省份
city:"长沙", //城市
dist:"岳麓区", //区县
nodata:"none" //当子集无数据时,隐藏select
})
当然,你还可以扩展,自定义下拉列表选项数据,你可以根据需要设置下拉内容,注意数据格式一定要为JSON格式。
$("#city").citySelect({
url:{"citylist":[
{"p":"前端技术","c":[{"n":"HTML"},{"n":"CSS","a":[{"s":"CSS2.0"},{"s":"CSS3.0"}]},
{"n":"JAVASCIPT"}]},
{"p":"编程语言","c":[{"n":"C"},{"n":"C++"},{"n":"PHP"},{"n":"JAVA"}]},
{"p":"数据库","c":[{"n":"Mysql"},{"n":"SqlServer"},{"n":"Oracle"}]},
]},
prov:"",
city:"",
dist:"",
nodata:"none"
})
你还可以利用PHP等后台语言将数据库中的数据转换成JSON格式,然后使用url参数指向后台地址也能实现无刷新联动效果。
$("#city").citySelect({
url:"data.php"
})