资讯

精准传达 • 有效沟通

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

网站建设 >

查看其它板块

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

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
返回首页 了解更多建站资讯

相关资讯

多年建站经验

多一份参考，总有益处

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

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

大客户专线   成都：13518219792   座机：028-86922220

在线咨询 提交需求
友情链接 交换友情链接
广汉锦华成都广告安装公司成都做网站乐山托管服务器响应式建站成都光彩外墙景观成都网站推广成都网络公司成都商城网站制作网站设计制作报价

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

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

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