0520三级联动

Posted 王策

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了0520三级联动相关的知识,希望对你有一定的参考价值。

主页面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>三级联动</title>
<script src="../jquery-1.11.2.min.js"></script>
<script src="sanji.js"></script>
</head>

<body>
<div id="sj"></div>
</body>
</html>

 

js处理页面

$(document).ready(function(e) {

$("#sj").html("<select id=‘sheng‘></select><select id=‘shi‘></select><select id=‘qu‘></select>");
填充省内容的方法
tiansheng();
填充市内容的方法
tianshi();
填充区内容的方法
tianqu();
当选中省的时候,填相应的市和区
$("#sheng").change(function(){
tianshi();
tianqu();

})
当选中市的时候,填相应的区
$("#shi").change(function() {
tianqu();
});
填省的方法
function tiansheng()
{
var code="0001";
$.ajax({
async:false,
url:"chuli.php",
data:{code:code},
type:"POST",
datatype:"TEXT",
success: function(zhi){
var str="";
var hang =zhi.split("|");
for(var i=0;i<hang.length;i++)
{
var lie=hang[i].split("^");
str+="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>"
}
$("#sheng").html(str);
}

});

}
填市的方法
function tianshi()
{
var code=$("#sheng").val();
$.ajax({
async:false,
url:"chuli.php",
data:{code:code},
type:"POST",
datatype:"TEXT",
success: function(zhi){
var str="";
var hang =zhi.split("|");
for(var i=0;i<hang.length;i++)
{
var lie=hang[i].split("^");
str+="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>"
}
$("#shi").html(str);

}

});

}
填区的方法
function tianqu()
{
var code=$("#shi").val();
$.ajax({
async:false,
url:"chuli.php",
data:{code:code},
type:"POST",
datatype:"TEXT",
success: function(zhi){
var str="";
var hang =zhi.split("|");
for(var i=0;i<hang.length;i++)
{
var lie=hang[i].split("^");
str+="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>"
}
$("#qu").html(str);

}

});

}
});

以上是关于0520三级联动的主要内容,如果未能解决你的问题,请参考以下文章

三级联动

ajax省市区三级联动

三级联动

PHP 三级联动

省市区三级联动

三级联动