您的位置：首页 > 理论基础 > 计算机网络

Ajax实现无刷新三联动下拉框

2008-01-22 13:50 776 查看

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAd>

</TITLE>

if (window.ActiveXObject && !window.XMLHttpRequest) ...{

window.XMLHttpRequest=function() ...{

return new ActiveXObject((navigator.userAgent.toLowerCase().indexOf('msie 6') != -1) ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP');

};

}//取得XMLHttpRequest对象

var req;

var flagSelect;

function testName(flag,value)//

...{

flagSelect = flag;

req=new XMLHttpRequest();

if (req)

...{

req.onreadystatechange=setValue;

}

req.open('POST',"getLabelValue.do?flag=" flag "&value=" value);

req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

req.send(null);

}

function setValue()

...{

if (req.readyState==4 )

...{

if(req.status==200)

...{

if(flagSelect=="1")//假如选择某个省要更新市和区

...{

var v=req.responseText.split("||");

paint(document.all("shi"),v[0]);

paint(document.all("qu"),v[1]);

}

if(flagSelect=="2")//假如选择某市,只需改变区

...{

var v=req.responseText;

paint(document.all("qu"),v);

}

function paint(obj,value)

...{

var ops = obj.options;

while(ops.length>0)

...{

ops.remove(0);

}

for(var i=0;i<v.length-1;i )

...{

var o = document.createElement("OPTION");

o.value=v[i].split(",")[0];

v.text=v[i].split(",")[1];

ops.add(o);

}

</script>

<body>

<table>

<tr>

<td>

省<select name="pro" onchange="testName(1,this.value);">

</select>

</td>

<td>

省<select name="shi" onchange="testName(2,this.value);">

</select>

</td>

<td>

区<select name="qu">

</select>

</td>

</tr>

</table>

</body>

</HTML>

写一个actioin

public class GetLabelValueAction extends Action {

public ActionForward execute(ActionMapping mapping, ActionForm form,

HttpServletRequest request, HttpServletResponse response) {

response.setContentType("text/xml; charset=GBK");

try {

PrintWriter out = response.getWriter();

String flag = request.getParameter("flag");

String value = request.getParameter("value");

if(flag==null)

{

return ;

}

StringBuffer values = new StringBuffer("");

//getconnection;

//query

//rs

if(flag.equals("1"))

{

rs = stmt.executeQuery("select 市编号,城市名称 from city_table where 省编号='" value "' order by 市编号");

while(rs.next())

{

values.append(rs.getString(1) "," rs.getString(2) ";");

}

String ff = values.substring(0,values.indexOf(",") 1);//最得敢小的市编号

rs = stmt.executeQuery("select 区编号,区名称 from city_table where 市编号='" ff "' order by 区编号");

values.append("||");//区分市和区信息.

while(rs.next())

{

values.append(rs.getString(1) "," rs.getString(2) ";");

}

}else if(flag.equals("2"))

{

rs = stmt.executeQuery("select 区编号,区名称 from city_table where 市编号='" value "' order by 区编号");

while(rs.next())

{

values.append(rs.getString(1) "," rs.getString(2) ";");

}

else

{

}

out.println(values.toString());

out.flush();

out.close();

} catch (IOException e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

return null;

}

Code highlighting produced by Actipro CodeHighlighter (freeware)

http://www.CodeHighlighter.com/

if(flag.equals("1"))

{

rs = stmt.executeQuery("select 市编号,城市名称 from city_table where 省编号='" value "' order by 市编号");

while(rs.next())

{

values.append(rs.getString(1) "," rs.getString(2) ";");

}

String ff = values.substring(0,values.indexOf(",") 1);//最得敢小的市编号

rs = stmt.executeQuery("select 区编号,区名称 from [color=#FF0000]area_table[/color] where 市编号='" ff "' order by 区编号");

values.append("||");//区分市和区信息.

while(rs.next())

{

values.append(rs.getString(1) "," rs.getString(2) ";");

}

www.itzhe.cn

<网友回复>function paint(obj,value)

{

var ops = obj.options;

while(ops.length> 0)

{

ops.remove(0);

}

for(var i=0;i <v.length-1;i )

{

var o = document.createElement( "OPTION ");

o.value=v[i].split( ", ")[0];

v.text=v[i].split( ", ")[1];

www.itzhe.cn

ops.add(o);

}

o.value=v[i].split( ", ")[0];

v.text=v[i].split( ", ")[1];

在请问以下上面的v在哪儿定义的

<网友回复>不好意思哈

JScript code

Code highlighting produced by Actipro CodeHighlighter (freeware)

http://www.CodeHighlighter.com/

function paint(obj,value)

{

var v = value.split(";");//在这里啦

var ops = obj.options;

while(ops.length>0)

{

ops.remove(0);

}

for(var i=0;i<v.length-1;i )

{

var o = document.createElement("OPTION");

o.value=v[i].split(",")[0];

v.text=v[i].split(",")[1];

ops.add(o);

}

本篇文章来源于 www.itzhe.cn 原文链接：http://www.itzhe.cn/html/web/JSP/20071113/18380_2.html

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： ajax xmlhttprequest function 数据库 table html

相关文章推荐

新的分享

章节导航