ajax 异步调用
本帖最后由 showbo 于 2012-11-01 11:57:12 编辑 index.aspx:
<script language="javascript" type="text/javascript">
// <!CDATA[
var xmlhttp=false;
function createHTTP()
{
try
{
xmlhttp=new ActiveXobject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
xmlhttp=new ActiveXobject("Microsoft.XMLHTTP");
}
catch(e2)
{
xmlhttp=false;
}
}
if(!xmlhttp && typeof XMLHttpRequest !='undefined'){
xmlhttp=new XMLHttpRequest();
}
}
function getData() {
var sAnimal=document.getElementById("txt").value;
createHTTP();
xmlhttp.onreadystatechange=statechange;
xmlhttp.open("GET","DataPage.aspx?sAnimal="+sAnimal,true);
xmlhttp.send(null);
}
function statechange()
{
if(xmlhttp.readystate==4)
{
if(xmlhttp.status==200)
{
FillData(xmlhttp.responsetext);
}
}
}
function FillData(sAnimal)
{
document.getElementById("DropDownList1").options.length=0;
var index;
var ani;
while(sAnimal.length>0)
{
index=sAnimal.indexOf(",");
if(index>0)
{
ani=sAnimal.substring)0,index);
sAnimal=sAnimal.substring(index+1);
document.getElementById("DropDownList1").add(new option(ani,ani));
}
else
{
lastAnimal=sAnimal.substring(0,2);
document.getElementById("DropDownList1").add(new option(lastAnimal,lastAnimal));
break;
}
}
}
// ]]>
</script>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td colspan="3" style="height: 102px; text-align: center">
<strong><span style="font-size: 14pt">基于AJAX技术实现页面局部更新</span></strong></td>
</tr>
<tr>
<td colspan="2" style="height: 85px">
请输入你所喜欢的动物种类</td>
<td style="width: 460px; height: 85px">
<input id="txt" style="width: 245px" type="text" /></td>
</tr>
<tr>
<td colspan="2" style="height: 85px">
</td>
<td style="width: 460px; height: 85px">
<input id="Submit1" type="submit" onclick="getData()" ></td>
</tr>
<tr>
<td style="height: 89px" colspan="2">
请选择你所喜欢的动物：</td>
<td style="width: 460px; height: 89px">
<asp:DropDownList ID="DropDownList1" runat="server">
</asp:DropDownList></td>
</tr>
</table>
</div>
</form>
</body>
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string sAnimal = Request.QueryString["sAnimal"];
Response.Clear();
switch (sAnimal.ToLower())
{
case "cat":
Response.Write("Felix, John, Mary, Rossy");
break;
case "dog":
Response.Write("Fido, Robver, Kissy");
break;
case "cow":
Response.Write("Daisy, Mighty, Hassy, Hover");
break;
case "parrot":
Response.Write("Polly, curo, paul, pazzy");
break;
}
}
}
