资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划，从策略到执行的一站式服务

网站建设 >

查看其它板块

几个不同类型无刷新联动例子

Iframe实现无刷新联动

iframe的无刷新其实是局部刷新，状态栏的滚动条还是会滚动，只是页面不会闪烁，这是一种比较老的技术了，在处理的数据两大的时候会比较慢，在本例中需要两个页面：oec2003index.aspx和oec2003frame.asapx,oec2003index.aspx用来显示界面，其中有一个iframe标记，指向oec2003frame.aspx页用来显示结果

网站建设哪家好，找成都创新互联！专注于网页设计、网站建设、微信开发、微信小程序开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了点军免费建站欢迎大家使用！

oec2003index.aspx前台代码

<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="oec2003Index.aspx.cs"Inherits="_Default"%>



    无标题页

    
        functionQuery() {
            varddlpro = document.getElementById('ddlPro');
            varpro = ddlpro.options[ddlpro.selectedIndex].innerText;
            if(pro != "") {
                document.getElementById("iframe1").src = "oec2003frame.aspx?Pro="+ pro;
            }
        }

    



    
    

        
            
                
           Iframe实现局部刷新
                
            
            
                
           省份名称:
                
                
                    
                        湖北
                        河北
                        广东
                        河南
                    
                    
                
            
            
                
           显示城市列表

oec2003frame.aspx的前台代码：

<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="oec2003frame.aspx.cs"Inherits="myframe"%>



    无标题页

oec2003frame.aspx后台代码：

usingSystem;
usingSystem.Data;
usingSystem.Configuration;
usingSystem.Collections;
usingSystem.Web;
usingSystem.Web.Security;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.WebControls.WebParts;
usingSystem.Web.UI.HtmlControls;

public partial classmyframe: System.Web.UI.Page{
    protected voidPage_Load(objectsender, EventArgse)
    {
        stringpro = Request.QueryString["pro"];
        switch(pro)
        {
            case"湖北":
                this.ddlCity.Items.Clear();
                this.ddlCity.Items.Add("武汉");
                this.ddlCity.Items.Add("黄冈");
                this.ddlCity.Items.Add("黄石");
                this.ddlCity.Items.Add("襄樊");
                break;
            case"河北":
                this.ddlCity.Items.Clear();
                this.ddlCity.Items.Add("石家庄");
                this.ddlCity.Items.Add("唐山");
                this.ddlCity.Items.Add("承德");
                this.ddlCity.Items.Add("邯郸");
                break;
            case"广东":
                this.ddlCity.Items.Clear();
                this.ddlCity.Items.Add("广州");
                this.ddlCity.Items.Add("佛山");
                this.ddlCity.Items.Add("深圳");
                this.ddlCity.Items.Add("珠海");
                break;
            case"河南":
                this.ddlCity.Items.Clear();
                this.ddlCity.Items.Add("郑州");
                this.ddlCity.Items.Add("新乡");
                this.ddlCity.Items.Add("安阳");
                this.ddlCity.Items.Add("信阳");
                break;

        }
    }
}

Javascript无刷新联动

前台页面代码：

<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="oec2003index.aspx.cs"
Inherits="jacascript_Default"%>



    无标题页

    
        functionFillData(strcity) {

            document.getElementById("ddlCity").options.length = 0;
            varindexofcity;
            varcity;
            while(strcity.length > 0) {
                indexofcity = strcity.indexOf(",");
                if(indexofcity > 0) {
                    city = strcity.substring(0, indexofcity);

                    strcity = strcity.substring(indexofcity + 1);
                    document.getElementById("ddlCity").add(newOption(city, city));
                }
                else{
                    document.getElementById("ddlCity").add(newOption(strcity, strcity));
                    break;
                }

            }
        }
    



    
    

        
            
                
           脚本方法实现刷新
                
            
            
                
           选择省份:
                
                
                    
                        湖北
                        河北
                        广东
                        河南
                    
                    
                
            
            
                
           城市:

后台代码：

usingSystem;
usingSystem.Data;
usingSystem.Configuration;
usingSystem.Collections;
usingSystem.Web;
usingSystem.Web.Security;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.WebControls.WebParts;
usingSystem.Web.UI.HtmlControls;
usingSystem.Text;

public partial classjacascript_Default: System.Web.UI.Page{
    protected voidPage_Load(objectsender, EventArgse)
    {
        StringBuildermyscript = newStringBuilder();
        myscript.Append("function City() {\n");
        myscript.Append("var ddlpro=document.getElementById('ddlPro');\n");
        myscript.Append("var pro=ddlpro.options[ddlpro.selectedIndex].innerText;\n");
        //myscript.Append("var pro=document.getElementById('txtPro').value;\n");
myscript.Append("switch(pro) { \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("case '河南':\n");
        myscript.Append("FillData('"+ GetCityStr("河南") + "');\n");
        myscript.Append("break;}\n");
        myscript.Append("}\n");

        Page.ClientScript.RegisterClientScriptBlock(typeof(string), "city", myscript.ToString(), true);

    }

    private stringGetCityStr(stringpro)
    {
        stringcity = "";
        switch(pro)
        {
            case"湖北":
                city = "武汉,黄冈,黄石,襄樊";
                break;
            case"河北":
                city = "石家庄,唐山,承德,邯郸";
                break;
            case"广东":
                city = "广州,佛山,深圳,珠海";
                break;
            case"河南":
                city = "郑州,新乡,安阳,信阳";
                break;
        }
        returncity;
    }
}

CallBack无刷新联动

前台代码：

<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="oec2003index.aspx.cs"Inherits="callback_Default"%>



    无标题页

    
         functionFillData()
         {
             varddlpro=document.getElementById('ddlPro');
             varpro=ddlpro.options[ddlpro.selectedIndex].value;
             <% =ClientScript.GetCallbackEventReference(this,"pro","FillDll",null) %>
         } 

        functionFillDll(strcity)
        {
            document.getElementById("ddlCity").options.length=0;
            varindexofcity;
            varcity;
            while(strcity.length>0)
            {
                indexofcity=strcity.indexOf(",");
                if(indexofcity>0)
                {
                    city=strcity.substring(0,indexofcity);
                    strcity=strcity.substring(indexofcity+1);
                    document.getElementById("ddlCity").add(newOption(city,city));
                }
                else
       {
                    document.getElementById("ddlCity").add(newOption(strcity,strcity));
                    break;
                }
            }
        }
    



    
    

        
            
                
           callback方法实现刷新
                
            
            
                
           选择省份:
                
                
                    
                        湖北
                        河北
                        广东
                        河南
                    
                    
                
            
            
                
           城市:

后台代码：

usingSystem;
usingSystem.Data;
usingSystem.Configuration;
usingSystem.Collections;
usingSystem.Web;
usingSystem.Web.Security;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.WebControls.WebParts;
usingSystem.Web.UI.HtmlControls; 

public partial classcallback_Default: System.Web.UI.Page,ICallbackEventHandler{
 private string_data;
 protected voidPage_Load(objectsender, EventArgse)
 { 

 } 

 //ICallbackEventHandler 成员}

Ajax无刷新联动

该例子也要用到两个页面：oec203index.aspx和oec2003datapage.aspx. oec2003datapage.aspx主要用来回送要显示的数据

oec2003.aspx页面前台代码：

<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="oec2003index.aspx.cs"Inherits="ajax_Default"%>



    无标题页

    
        varxmlhttp;
        functiongetData() {
            varddlpro = document.getElementById("ddlPro");
            varpro = ddlpro.options[ddlpro.selectedIndex].innerText;
            xmlhttp = newActiveXObject("Microsoft.XMLHTTP");
            xmlhttp.onreadystatechange = statechange;
            xmlhttp.Open("GET", "oec2003datapage.aspx?pro="+ pro, true);
            xmlhttp.Send();
        }

        functionstatechange() {
            if(xmlhttp.readystate == 4) {
                if(xmlhttp.status == 200) {
                    FillData(xmlhttp.responseText);
                }
            }
        }
        functionFillData(strcity) {
            document.getElementById("ddlCity").options.length = 0;
            varindexofcity;
            varcity;
            while(strcity.length > 0) {
                indexofcity = strcity.indexOf(",");
                if(indexofcity > 0) {
                    city = strcity.substring(0, indexofcity);
                    strcity = strcity.substring(indexofcity + 1);
                    document.getElementById("ddlCity").add(newOption(city, city));
                }
                else{
                    document.getElementById("ddlCity").add(newOption(strcity, strcity));
                    break;
                }
            }
        }
    



    
    

        
            
                
           ajax方法实现刷新
                
            
            
                
           选择省份:
                
                
                    
                        湖北
                        河北
                        广东
                        河南
                    
                    
                
            
            
                
           城市:

oec2003datapage.aspx后台代码：

usingSystem;
usingSystem.Data;
usingSystem.Configuration;
usingSystem.Collections;
usingSystem.Web;
usingSystem.Web.Security;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.WebControls.WebParts;
usingSystem.Web.UI.HtmlControls;

public partial classajax_datapage: System.Web.UI.Page{
    protected voidPage_Load(objectsender, EventArgse)
    {
        stringpro = Request.QueryString["pro"];
        Response.Clear();
        switch(pro)
        {
            case"湖北":
                Response.Write("武汉,黄冈,黄石,襄樊");
                break;
            case"河北":
                Response.Write("石家庄,唐山,承德,邯郸");
                break;
            case"广东":
                Response.Write("广州,佛山,深圳,珠海");
                break;
            case"河南":
                Response.Write("郑州,新乡,安阳,信阳");
                break;
        }
    }
}

文章名称：几个不同类型无刷新联动例子
本文路径：http://cdkjz.cn/article/gpdieo.html
返回首页 了解更多建站资讯

相关资讯

多年建站经验

多一份参考，总有益处

联系快上网，免费获得专属《策划方案》及报价

咨询相关问题或预约面谈，可以通过以下方式与我们联系

业务热线：400-028-6601 / 大客户专线   成都：13518219792   座机：028-86922220

在线咨询 提交需求
友情链接 交换友情链接
自贡电信机房简阳电信机房广东帝美豪门窗高端品牌网站建设虚拟主机卖友情链接成都服务器托管云服务器成都网站建设LED显示屏

成都网站建设公司地址：成都市青羊区太升南路288号锦天国际A座10层 建设咨询400-028-6601

成都快上网科技有限公司-四川网站建设设计公司 | 蜀ICP备19037934号 Copyright 2020,ALL Rights Reserved cdkjz.cn | 成都网站建设 | © Copyright 2020版权所有.

专家团队为您提供成都网站建设,成都网站设计,成都品牌网站设计,成都营销型网站制作等服务,成都建网站就找快上网！ | 成都网站建设哪家好？ | 网站建设地图