Ajax實現局部重新整理

 

Ajax實現局部重新整理    <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;        }    } -------------------------------------------------------------------------------使用回調技術實現局部重新整理 <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;        }    }-------------------------------------------------------------------------------------Iframe實現局部重新整理    <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;        }    }---------------------------------------------------------------------------------使用指令碼方法實現局部重新整理        <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;    }