急:JS调用没有反应

JavaScript015

急:JS调用没有反应,第1张

2个可能,一个就是你js文件的路径写错了,你的js和jsp在同一级目录下吗?

如果不是,那么你的路径就写错了。

第二个如果你的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"

})