java中地址级联显示_ajax+jQuery实现级联显示地址的方法

本文实例讲述了ajax+jQuery实现级联显示地址的方法。分享给大家供大家参考。具体实现方法如下：

contentType="text/html; charset=utf-8"

%>

初始化HELLO

$(document).ready(function(){

var str1='${str}';

var strArr=str1.split(",");

var k;

for(k=0;k

{

$.ajax({

async:false,//原来是这样,不然AJAX是一起发送的,加上这个的话,就保证这个请求有结果,才会发下一个请求

url:'init.action',//请求的URL

cache: false, //不从缓存中取数据

data:{pid:strArr[k]},//发送的参数

type:'Get',//请求类型

dataType:'json',//返回类型是JSON

timeout:20000,//超时

error:function()//出错处理

{

alert("程序出错!");

},

success:function(json)//成功处理

{

var len=json.length;//得到查询到数组长度

if(strArr[k]=="0")//顶目属地

{

$("").appendTo("#content");//在content中添加select元素

$("请选择").appendTo("#no1");

for(var i=0;i

{

$(""+json[i].channelName+"").appendTo("#no1");

}

}

else

{

$("").appendTo("#content");

$("请选择").appendTo("#content>select:last");

for(var i=0;i

{

$(""+json[i].channelName+"").appendTo("#content>select:last");

}

$("#content>select:eq("+(k-1)+")>option[@value="+strArr[k]+"]").attr("selected","true");//设置选中

if(len==0)//最后一级,没东西就把它给删除

{

$("#content>select:last").remove();

}

}

}

});

}//for循环的结尾

});

function show()

{

var obj=event.srcElement;//取得当前事件的对象,也就是你点了哪个select,这里得到的就是那个对象

var currentObj=$(obj);//将JS对象转换成jQuery对象,这样才能使用其方法

var s1=$(obj).nextAll("select");//找到当前点击的后面的select对象

s1.each(function(i){

$(this).remove();//循环把它们删除

});

var value1=$(obj).val();

$.ajax({

url:'init.action',

cache:false,

data:{pid:value1},

type:'Get',

dataType:'json',

timeout:20000,

error:function()

{

alert("出错啦");

},

success:function(json)

{

var len=json.length;

if(len!=0)

{

$("").appendTo("#content");

$("请选择").appendTo("#content>select:last");

for(var i=0;i

{

$(""+json[i].channelName+"").appendTo("#content>select:last");

}

}

}

});

}

显示管理员信息

管理员编号
管理员帐号
管理员姓名
管理员密码
管理员属地

style="width: 500px; border: 1px; border-style: solid; background-color: lightblue;">

希望本文所述对大家的jquery程序设计有所帮助。