省份信息显示正常,但是获取城市信息的时候,遇到了奇葩的问题
获取的城市信息永远是default的值 “你是个奇葩”,若是我手动指定$province = “山东省”则正确显示
实在找不到这个现象的原因,各种尝试
求高人指点
PS:AJAX没有问题,数据传输都是正常的
HTML的内容
<!DOCTYPE html>
<html>
<head>
<title>Ajax实现二级联动</title>
<meta charset="utf-8"/>
</head>
<body>
<form>
<select id="province" name="XXX">
<option>请选择</option>
</select>
<select id="city">
<option>请选择</option>
</select>
</form>
<script>
//Ajax从服务器获取省份信息
var xhr = getXhr();
var province = document.getElementById('province');
window.onload=function(){
xhr.open("get","7-province.php?province=province");
xhr.send(null);
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
var data = xhr.responseText;
var provs = data.split(",");
var provHTML = [];
for(var i=0;i<provs.length;i++){
provHTML[i]="<option value="+provs[i]+">"+provs[i]+"</option>";
}
province.innerHTML="<option>请选择</option>"+provHTML.join("");//join里空白的话默认 逗号分割
}
}
}
//2.当用户选择省份信息时,Ajax获取城市信息
province.onchange = function(){
if(province.value!="请选择"){
xhr.open("post","7-cities.php");
xhr.setRequestHeader("Content-Type","Application/x-www-form-rulencoded");
//console.log(province.value);//OK
xhr.send("province="+province.value);
xhr.onreadystatechange = function(){
if(xhr.readyState==4&&xhr.status==200){
var data = xhr.responseText;
console.log(data);
}
}
}
}
function getXhr(){
var xhr=null;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
}else{
xhr = new ActiveXObject("Microsoft.XMLHttp");
}
return xhr;
}
</script>
</body>
</html>
省份PHP文件 7-province.php
<?php
$province = 0;
@$province = $_GET['province'];
// echo @province; //@是为了不显示警告
if(isset($province)){
echo "山东省,湖南省,河南省";
}
?>
城市php文件 7-cities.php
<?php
$province = null;
@$province = $_POST['province'];/*"山东省"*/ //这里直接让@$province = "山东省",页面返回字符串 "山东1,山东2,山东3,山东4,山东5"
if(isset($province)){
switch($province){
case "山东省":
echo "山东1,山东2,山东3,山东4,山东5";
break;
case "湖南省":
echo "湖南1,湖南2,湖南3";
break;
case "河南省":
echo "河南1,河南2";
break;
default:
echo "你真是个奇葩";
break;
}
}else{
echo 'prov无效';
}
?>
用f12调试一下吧,可以看Network里面的网络请求信息,看看请求和参数是否正确.
// 获取城市的时候,你确定province.value传递的是中文?
province.onchange = function()
xhr.send("province="+province.value);
推荐你看看《锋利的jQuery》.
城市信息也不多,你弄个压缩的json文件保存下拉取一下就可以了还非要自己去分级请求
本人不懂php,但是我认为你给@$province赋值有问题
妹的,傻逼了2天终于知道自己多傻逼了,Content-Type 我写成 aplication/x-www-form-rulencoded ,居然是rulencoded这么弱智的错误,耽误大家时间了,不好意思