分享个极好的无刷新二级联动下拉列表,同样适用与firefox
点击次数：24 次 发布日期：2008-11-26 15:49:12 作者：源代码网
|
源代码网推荐 可能"极好的"又会带来很多的非议,但是我认为这确实很好,我看了大约20个无刷新的连动下拉列表,他们在firefox下面就一团糟.为了这个我差不多搞了两天,就是如果提交窗体后如何保持第二个列表框的值,因为通过js 给下拉框添加条目那么他的状态是不会被保存的 源代码网推荐 测试平台:ie6,firefox 源代码网推荐 功能:二级无刷新连动 源代码网推荐 特点:跨浏览器;提交窗体取第二下拉框的值;数据来源于数据库;以xmlhttp来发送请求,实现无刷新 源代码网推荐 请求:如果您能够找到更好的方法请告诉我,非常感谢,您的批评和建议对我是莫大的鼓励 源代码网推荐 webform1.aspx: 源代码网推荐 <%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="drop.WebForm1" %> 源代码网推荐 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 源代码网推荐 <HTML> 源代码网推荐 <HEAD> 源代码网推荐 <title>WebForm1</title> 源代码网推荐 <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1"> 源代码网推荐 <meta name="CODE_LANGUAGE" Content="C#"> 源代码网推荐 <meta name="vs_defaultClientScript" content="JavaScript"> 源代码网推荐 <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5"> 源代码网推荐 <script language="javascript"> 源代码网推荐 //jb函数会根据不同的浏览器初始化个xmlhttp对象 源代码网推荐 function jb() 源代码网推荐 { 源代码网推荐 var A=null; 源代码网推荐 try 源代码网推荐 { 源代码网推荐 A=new ActiveXObject("Msxml2.XMLHTTP"); 源代码网推荐 } 源代码网推荐 catch(e) 源代码网推荐 { 源代码网推荐 try 源代码网推荐 { 源代码网推荐 A=new ActiveXObject("Microsoft.XMLHTTP"); 源代码网推荐 } 源代码网推荐 catch(oc) 源代码网推荐 { 源代码网推荐 A=null 源代码网推荐 } 源代码网推荐 } 源代码网推荐 if ( !A && typeof XMLHttpRequest != "undefined" ) 源代码网推荐 { 源代码网推荐 A=new XMLHttpRequest() 源代码网推荐 } 源代码网推荐 return A 源代码网推荐 } 源代码网推荐 源代码网推荐 //下面Go函数是父列表框改变的时候调用，参数是选择的条目 源代码网推荐 function Go(obj) 源代码网推荐 { 源代码网推荐 //得到选择框的下拉列表的value 源代码网推荐 var svalue = obj.value; 源代码网推荐 //定义要处理数据的页面 源代码网推荐 var weburl = "webform1.aspx?parent_id="+svalue; 源代码网推荐 //初始化个xmlhttp对象 源代码网推荐 var xmlhttp = jb(); 源代码网推荐 //提交数据，第一个参数最好为get，第三个参数最好为true 源代码网推荐 xmlhttp.open("get",weburl,true); 源代码网推荐 // alert(xmlhttp.responseText); 源代码网推荐 //如果已经成功的返回了数据 源代码网推荐 xmlhttp.onreadystatechange=function() 源代码网推荐 { 源代码网推荐 if(xmlhttp.readyState==4)//4代表成功返回数据 源代码网推荐 { 源代码网推荐 var result = xmlhttp.responseText;//得到服务器返回的数据 源代码网推荐 //先清空dListChild的所有下拉项 源代码网推荐 document.getElementById("dListChild").length = 0; 源代码网推荐 //给dListChild加个全部型号的,注意是Option不是option 源代码网推荐 document.getElementById("dListChild").options.add(new Option("全部型号","0")); 源代码网推荐 if(result!="")//如果返回的数据不是空 源代码网推荐 { 源代码网推荐 //把收到的字符串按照，分割成数组 源代码网推荐 var allArray = result.split(","); 源代码网推荐 //循环这个数组，注意是从1开始，因为收到的字符串第一个字符是，号，所以分割后第一个数组为空 源代码网推荐 for(var i=1;i<allArray.length;i++) 源代码网推荐 { 源代码网推荐 //在把这个字符串按照|分割成数组 源代码网推荐 var thisArray = allArray[i].split("|"); 源代码网推荐 //为dListChild添加条目 源代码网推荐 document.getElementById("dListChild").options.add(new Option(thisArray[1].toString(),thisArray[0].toString())); 源代码网推荐 } 源代码网推荐 } 源代码网推荐 } 源代码网推荐 } 源代码网推荐 //发送数据，请注意顺序和参数，参数一定为null或者"" 源代码网推荐 xmlhttp.send(null); 源代码网推荐 } 源代码网推荐 </script> 源代码网推荐 </HEAD> 源代码网推荐 <body MS_POSITIONING="GridLayout"> 源代码网推荐 <form id="Form1" method="post" runat="server"> 源代码网推荐 <asp:DropDownList onchange="Go(this)" id="dListParent" style="Z-INDEX: 101; LEFT: 248px; POSITION: absolute; TOP: 40px" 源代码网推荐 runat="server"> 源代码网推荐 <asp:ListItem Value="100">摩托罗拉</asp:ListItem> 源代码网推荐 <asp:ListItem Value="101">诺基亚</asp:ListItem> 源代码网推荐 </asp:DropDownList> 源代码网推荐 <asp:DropDownList id="dListChild" style="Z-INDEX: 102; LEFT: 248px; POSITION: absolute; TOP: 104px" 源代码网推荐 runat="server"></asp:DropDownList> 源代码网推荐 <asp:Button id="Button1" style="Z-INDEX: 103; LEFT: 256px; POSITION: absolute; TOP: 176px" runat="server" 源代码网推荐 Text="Button"></asp:Button> 源代码网推荐 </form> 源代码网推荐 </body> 源代码网推荐 </HTML> 源代码网推荐 源代码网推荐 后台webform1.aspx.cs: 源代码网推荐 using System; 源代码网推荐 using System.Collections; 源代码网推荐 using System.ComponentModel; 源代码网推荐 using System.Data; 源代码网推荐 using System.Drawing; 源代码网推荐 using System.Web; 源代码网推荐 using System.Web.SessionState; 源代码网推荐 using System.Web.UI; 源代码网推荐 using System.Web.UI.WebControls; 源代码网推荐 using System.Web.UI.HtmlControls; 源代码网推荐 using System.Configuration; 源代码网推荐 using System.Data.SqlClient; 源代码网推荐 源代码网推荐 namespace drop 源代码网推荐 { 源代码网推荐 /// <summary> 源代码网推荐 /// WebForm1 的摘要说明。 源代码网推荐 /// </summary> 源代码网推荐 public class WebForm1 : System.Web.UI.Page 源代码网推荐 { 源代码网推荐 protected System.Web.UI.WebControls.DropDownList dListParent; 源代码网推荐 protected System.Web.UI.WebControls.Button Button1; 源代码网推荐 protected System.Web.UI.WebControls.DropDownList dListChild; 源代码网推荐 源代码网推荐 private void Page_Load(object sender, System.EventArgs e) 源代码网推荐 { 源代码网推荐 // 在此处放置用户代码以初始化页面 源代码网推荐 //if(!IsPostBack) 源代码网推荐 //{ 源代码网推荐 BindDrop();//如果不是提交回来就绑定列表框 源代码网推荐 / 源代码网供稿. |
