Asp.Net教程,WinForm教程,Asp.Net MVC,vs2008教程,vs2010教程,Silverlight技术,源码下载,Asp.Net视频教程
全站热门标签
vs2010 Silverlight 存储过程 水晶报表 ADO.NET JavaScript LINQ AjaxPro DataGridView 面向对象 Extjs GridView XML DevExpress HTML教程 Oracle jQuery 分页 GDI+ Visual C++2010 MySQL Office2010 WPF MVC Dojo WCF4.0 VB.NET Sql2005 textbox cookie WCF WinForm Discuz!NT SQL经典语句 T-SQL checkbox ASPxGridView F# asp.net SQL VS2008新特性 DropDownList Access TreeView Ajax VS2008 页面执行时间 Flex 字符串 回调 VB2005 DataSet C#时间 ASP.NET性能优化 用户在线检测 动画
jQuery JavaScript Html/Css Flex Dojo ExtJSAJAX
当前位置: 主页 > Web编程 > AJAX >

四种局部刷新技术的比较

时间:2009-09-09 22:09来源:未知 作者:admin 点击:

本文主要讲述四种局部刷新技术的比较

一、iframe技术:

二、javascript技术

三、CallBack技术

四、Ajax技术

 

一、iframe技术:

属于最慢的一种:因为它属于完全的服务器端技术,会不断的与服务器端进行交互

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
    <script type="text/javascript" language="javascript">
        function Search()
        {
            var city = document.getElementById("TextBox1").value;
            if(city != "")
            {
                document.getElementById("iframe1").src = "myframe.aspx?city="+city;
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        &nbsp;
    </div>
    <div style="width:100px; height:100px; vertical-align:middle; text-align:center">
        <table style="width:549px">
            <tr>
                <td colspan="2" style="font-weight:bold; color:#0000cc">
                    Iframe实现局部刷新
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td>
                    城市名称:
                </td>
                <td>
                    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                    <input id="Button2" style="width:153px" type="button" value="查询" onclick="Search()" />
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td style="height:52px">
                </td>
                <td style="height:52px">
                    <iframe src="myframe.aspx" style="text-align:center" id="iframe1" width="100%" height="100%" frameborder="0" scrolling="no">
                    </iframe>
                </td>
                <td style="height:52px">
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>


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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:DropDownList ID="DropDownList1" runat="server">
        </asp:DropDownList></div>
    </form>
</body>
</html>


二、javascript技术

应该算最快的了,因为它采用完全客户端技术,不需要在运行过程中与服务器交互,但它第一次加载时需要加载全部需要的数据.然后还有一个缺点,就是:需要大量的javascript脚本,可能会使客户端编程胖客户端.

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

public partial class Default2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        StringBuilder myscript = new StringBuilder();
        myscript.Append("function seekCity() {\n");
        myscript.Append("var city=document.getElementById('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;
    }
}


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
    <script type="text/javascript" language="javascript">
       
        function FillData(strcity)
        {
            document.getElementById("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.getElementById("DropDownList1").add(new Option(city, city));
                }
                else
                {
                    document.getElementById("DropDownList1").add(new Option(strcity, strcity));
                    break;
                }
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        &nbsp;
    </div>
    <div style="width:100px; height:100px; vertical-align:middle; text-align:center">
        <table style="width:549px">
            <tr>
                <td colspan="2" style="font-weight:bold; color:#0000cc">
                    Iframe实现局部刷新
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td>
                    城市名称:
                </td>
                <td>
                    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                    <input id="Button2" style="width:153px" type="button" value="查询" onclick="seekCity()" />
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td style="height:52px">
                </td>
                <td style="height:52px">
                </td>
                <td style="height:52px">
                </td>
            </tr>
        </table>
    </div>
        <asp:DropDownList ID="DropDownList1" runat="server">
        </asp:DropDownList>
    </form>
</body>
</html>

(责任编辑:admin)

Tags:刷新技术
责任编辑:admin
返回顶部
------分隔线----------------------------
推荐内容
骆驼户外男 真皮磨砂日常休闲鞋 低帮 2011秋冬新款 专柜正品特价 骆驼户外男 真皮磨砂日常休闲鞋 低帮 2011秋冬新款 专柜正品特价
  • JQuery RadioButtonList

    首先介绍程序规则: 1.对以下的选择进行检查,检查是否全部选中 2,所谓的全部选中是指,一行中三个radiobutton必须有一个radiobutton被选中。...

  • JQuery实现智能输入提示(仿机票预订网站)

    最近在研究JQuery框架,JQuery是一套很优秀的JS框架,可以实现很多美观实用的控件。今天给大家推荐一个智能提示的空间,是模仿现在很多机票预订网站的城市智...

  • jQuery得到ashx返回的JSON格式的DataSet的方法

    jQuery得到ashx返回的JSON格式的DataSet的方法...

  • JQuery点击行(tr)实现checkBox选中,反选时移除和添加样式

    用到了三元运算符,和一个自定义的函数。 点击行时效果代码: $( tr ).live( click , function (){ if ($( this ).h...

  • 用jQuery模仿新浪微博时间组件

    废话不多说,实现原理主要是处理table,生成tr td,其中最重要的是如何找出每月第一天是星期几,然后就能对应出这个月的余下天数. 首先,说下有些人说这是重复...

  • Jquery之Ajax运用_学习运用篇

    JQuery中Ajax的运用相信很多人都已熟悉,本文主要是记录下个人实践中的应用知识,旨在加强记忆。 还是先说一些 基础知识: 语法:$.ajax({optio...

  • JQuery单选按钮和多选按钮状态判断

    function check_required() { var valid = true; var required=new Array; $(.require...

  • jQuery AJAX的小应用——手机号码归属地查询

    jQuery AJAX的小应用手机号码归属地查询 想测试下jQuery调用个第三方的WebService,利用 jQuery 的 $.get(url, data...

  • 多标签折页(jQuery示例)

    现在的垃圾留言越来越智能,并且从留言内容几乎看不出来是垃圾留言,而大量的垃圾留言会导致文章可读性下降,并可能会被搜索引擎惩罚,经过一段时间的分析和思考,我发现一...

  • JQuery 文本框高亮显示插件

    JQuery 中没有这个方法,自己今天写了一个Plugin,把代码贴出来分享一下; 代码如下: jquery-highlight.js /* descripti...

  • jquery的select插件

    Jquery是可以操作select表单控件的,比较反锁,下面是收集来的一个插件,还不错,能满足基本的选择。 可以使用这样的引入: type=text/javas...

  • 使用Jquery完成图片的预加载

    // 定义预加载图片列表的函数(有参数) jQuery.preloadImages = function (){ // 遍历图片 for ( var i = 0...

  • jQuery在asp.net中实现图片自动滚动

    时间真快,不知不觉12月已经过了一半了,新的一年即将到来。有段时间没写东西了,技术这东东天天都在更新,天天都是一个新面孔,如果不坚持学习肯定就会落在队尾。要想跟...

  • JQuery遍历表格指定列

    script type=text/javas cript $(function(){ $(#tb tr:gt(0)).each(function(){ var ...

  • AJAX无刷新下拉框联动

    AJAX无刷新下拉框联动的简单示例,分别使用了AJAX组件和xmlHttp异步刷新两种方式。 前台代码: %...@ Page Language=C# Auto...