- <span style="font-size:18px;color:#ff6666;">Ajax实现局部刷新</span>
- <span style="font-size:16px;"><script type="text/javascript">
- var xmlhttp;
- function getData()
- {
- //获取用户填写的名称
- var city=document.getElementByIdx("txt").value;
- //创建异步调用对象
- xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
- //将对象状态与事件相关联
- xmlhttp.onreadystatechange=statechange;
- //加载要链接的页面
- xmlhttp.Open("POST","datapage.aspx?city=" +city,true);
- //发送请求
- xmlhttp.Send();
- }
- function statechange()
- {
- //判断异步调用是否已经完成
- if(xmlhttp.readystate==4)
- {
- //判断完成的提示代码是否是OK状态
- if(xmlhttp.status==200)
- {
- //将返回数据作为参数,传递给填充方法
- FillData(xmlhttp.responseText);
- }
- }
- }
- function FillData(strcity)
- {
- document.getElementByIdx("DropDownList1").options.length=0;
- var indexofcity;
- var city;
- //切割传递来的字符串
- while(strcity.length>0)
- {
- //判断是否是最后一个字符串
- indexofcity=strcity.indexOf(",");
- if(indexofcity >0)
- {
- city=strcity.substring(0,indexofcity);
- strcity=strcity.substring(indexofcity+1);
- //填充下拉框
- document.getElementByIdx("DropDownList1").add(new Option(city,city));
- }
- else
- {
- // 如果是最后一个字符串
- lastcity=strcity.substring(0,2);
- document.getElementByIdx("DropDownList1").add(new Option(lastcity,lastcity));
- break;
- }
- };
- }
- </script>
- 第二个页面
- protected void Page_Load(object sender, EventArgs e)
- {
- //获取传递过来的参数
- string city =Request.QueryString["city"];
- Response.Clear();
- //判断城市名
- switch (city)
- {
- case "beijing":
- //填充相关的区域
- Response.Write("朝阳,海淀,东城,西城");
- break;
- case "shanghai":
- Response.Write("浦东,静安,虹口,徐汇");
- break;
- case "jinan":
- Response.Write("历下,历城,市中,天桥");
- break;
- }
- }
- </span>
- -------------------------------------------------------------------------------
- <span style="font-size:18px;color:#ff6666;">使用回调技术实现局部刷新</span>
- <span style="font-size:16px;"><script type="text/javascript">
- function FillData()
- {
- var city=document.getElementByIdx("TextBox1").value;
- <% =this.ClientScript.GetCallbackEventReference(this,"city","FillDll",null) %>;
- }
- function FillDll(strcity)
- {
- document.getElementByIdx("DropDownList1").options.length=0;
- var indexofcity;
- var city;
- //切割传递来的字符串
- while(strcity.length>0)
- {
- //判断是否是最后一个字符串
- indexofcity=strcity.indexOf(",");
- if(indexofcity >0)
- {
- city=strcity.substring(0,indexofcity);
- strcity=strcity.substring(indexofcity+1);
- //填充下拉框
- document.getElementByIdx("DropDownList1").add(new Option(city,city));
- }
- else
- {
- // 如果是最后一个字符串
- document.getElementByIdx("DropDownList1").add(new Option(strcity,strcity));
- break;
- }
- };
- }
- </script>
- private string _data;
- public string GetCallbackResult()
- {
- //返回处理后的数据
- return _data;
- }
- public void RaiseCallbackEvent(string eventArgument)
- {
- //判断传递过来的参数
- switch (eventArgument)
- {
- case "北京":
- _data = "朝阳,海淀,东城,西城";
- break;
- case "上海":
- _data = "浦东,静安,徐汇,虹口";
- break;
- case "济南":
- _data = "历城,历下,市中,天桥";
- break;
- }
- }
- </span>-------------------------------------------------------------------------------------
- <span style="font-size:18px;color:#ff6666;">Iframe实现局部刷新</span>
- <span style="font-size:16px;"><script language="javascript">
- function Search()
- {
- var city=document.getElementByIdx("TextBox1").value;
- if(city !="")
- {
- document.getElementByIdx("iframe1").src="myframe.aspx?city=" +city;
- }
- }
- </script>
- <iframe src="myframe.aspx" style="TEXT-ALIGN: center" id="iframe1" width="100%" height="100%" frameborder="0" scrolling="no"/>
- 第二页面myframe.aspx
- <div style="TEXT-ALIGN: center">
- <asp:DropDownList ID="DropDownList1" runat="server" Width="154px">
- </asp:DropDownList></div>
- protected void Page_Load(object sender, EventArgs e)
- {
- //获取传递过来的参数
- string city = Request.QueryString["city"];
- //判断城市名
- switch (city)
- {
- case "北京":
- //填充相关的区域
- DropDownList1.Items.Clear();
- DropDownList1.Items.Add("朝阳");
- DropDownList1.Items.Add("海淀");
- DropDownList1.Items.Add("东城");
- DropDownList1.Items.Add("西城");
- break;
- case "上海":
- DropDownList1.Items.Clear();
- DropDownList1.Items.Add("浦东");
- DropDownList1.Items.Add("静安");
- DropDownList1.Items.Add("虹口");
- DropDownList1.Items.Add("徐汇");
- break;
- case "济南":
- DropDownList1.Items.Clear();
- DropDownList1.Items.Add("历下");
- DropDownList1.Items.Add("历城");
- DropDownList1.Items.Add("市中");
- DropDownList1.Items.Add("天桥");
- break;
- }
- }
- ---------------------------------------------------------------------------------
- <span style="color:#ff6666;">使用脚本方法实现局部刷新</span>
- <script type="text/javascript">
- function FillData(strcity)
- {
- document.getElementByIdx("DropDownList1").options.length=0;
- var indexofcity;
- var city;
- //切割传递来的字符串
- while(strcity.length>0)
- {
- //判断是否是最后一个字符串
- indexofcity=strcity.indexOf(",");
- if(indexofcity >0)
- {
- city=strcity.substring(0,indexofcity);
- strcity=strcity.substring(indexofcity+1);
- //填充下拉框
- document.getElementByIdx("DropDownList1").add(new Option(city,city));
- }
- else
- {
- // 如果是最后一个字符串
- document.getElementByIdx("DropDownList1").add(new Option(strcity,strcity));
- break;
- }
- };
- }
- </script>
- using System.Text;
- protected void Page_Load(object sender, EventArgs e)
- {
- //创建字符串连接对象
- StringBuilder myscript = new StringBuilder();
- //使用字符串组织一个JavaScript脚本方法
- myscript.Append("function seekCity() {\n");
- myscript.Append("var city=document.getElementByIdx('TextBox1').value; \n");
- myscript.Append("switch(city) {\n");
- myscript.Append("case '北京': \n");
- myscript.Append("FillData('" + GetCityStr("北京") +"'); \n");
- myscript.Append("break; \n");
- myscript.Append("case '上海': \n");
- myscript.Append("FillData('" + GetCityStr("上海") + "'); \n");
- myscript.Append("break; \n");
- myscript.Append("case '济南': \n");
- myscript.Append("FillData('" + GetCityStr("济南") + "'); \n");
- myscript.Append("break; }\n");
- myscript.Append(" }\n");
- //使用注册脚本方法在页面的客户端,注册这个字符串编写的脚本方法。
- Page.ClientScript.RegisterClientScriptBlock(typeof(string), "seekCity", myscript.ToString(),true);
- }
- //通过获取城市名,返回城市的区县字符串
- private string GetCityStr(string INcity)
- {
- string city="";
- switch (INcity)
- {
- case "北京":
- city = "朝阳,海淀,东城,西城";
- break;
- case "上海":
- city = "浦东,静安,徐汇,虹口";
- break;
- case "济南":
- city = "历城,历下,市中,天桥";
- break;
- }
- //返回包含区县的 字符串连接
- return city;
- }
- </span>