今天就让我们看看在 ASP.NET 中使用 jQuery.load() 方法来调用 ASP.NET 的方法，实现无刷新的加载数据。

使用 jQuery 的朋友应该知道可以使用 jQuery.load() 加载静态页面，并可指定要加载的区域，如在"test.html"中有如下内容：

<div id="show">

    <a href="http://www.jquery001.com/">jQuery001</a>

</div>

<div>

    <a href="http://www.xxx.com/">xxx</a>

</div>

在调用页面"Default.aspx"如下：

<body>

    <div id="result"></div>

</body>

$(document).ready(function() {

    $("#result").load("test.html #show");

});

相信大家能够想像到输出的结果，这样调用只会加载 id 为"show" 的 div 中的内容。下边我们进入本文的主题，看看在 ASP.NET 中怎么使用 jQuery.load() 方法无刷新的调用后台方法。假如有后台代码如下，它根据 "owner" 参数，绑定rptTest：

public partial class _Default : System.Web.UI.Page

{

    public List website;

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            SetTestData();

            if (!string.IsNullOrEmpty(Request.QueryString["owner"]))

            {

                rptTest.DataSource = website.Where(m => m.Owner == Request.QueryString["owner"]);

                rptTest.DataBind();

            }

        }

    }

    public void SetTestData()

    {

        website = new List();

        website.Add(new Website() { Name = "Google+", Owner = "Google" });

        website.Add(new Website() { Name = "Youtube", Owner = "Google" });

        website.Add(new Website() { Name = "265.com", Owner = "Google" });

        website.Add(new Website() { Name = "asp.net", Owner = "Microsoft" });

        website.Add(new Website() { Name = "MSN", Owner = "Microsoft" });

    }

    protected void btnTest_Click(object sender, EventArgs e)

    {

    }

}

public class Website

{

    public string Name { get; set; }

    public string Owner { get; set; }

}

前台代码如下，执行 "btnTest" 单击事件时，使用 event.preventDefault()阻止了按钮的默认执行方式，从而使用 jQuery.load() 方法传递了"owner"参数访问 Default.aspx 页面：

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <script src="js/jquery.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function() {

            $("#result").load("test.html #show");

            $("#<%= btnTest.ClientID %>").click(function(event) {

                event.preventDefault();

                var owner = $("#<%= ddlTest.ClientID %>").val();

                $("#result").load("Default.aspx?owner=" + owner + " #show");

            });

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

        <div id="show">

            <asp:Repeater ID="rptTest" runat="server">

                <ItemTemplate>

                    <div><%#Eval("owner") %>：<%#Eval("Name") %></div>

                </ItemTemplate>

            </asp:Repeater>

        </div>

    <%=DateTime.Now %>

    <div id="result"></div>

    <asp:DropDownList ID="ddlTest" runat="server">

        <asp:ListItem Value="Google">Google</asp:ListItem>

        <asp:ListItem Value="Microsoft">Microsoft</asp:ListItem>

    </asp:DropDownList>

    <asp:Button ID="btnTest" runat="server" Text="查询" onclick="btnTest_Click" />

    </form>

</body>

其他没有什么新知识，其中输出了当前时间来验证使用这种方法并没有刷新页面,结果如下图所示：

在 ASP.NET Webform 中适当使用这种方式可减少页面刷新，从而提高用户体验。你可以从 jQuery学习直接下载在 ASP.NET 中使用 jQuery.load() 方法

http://www.jquery001.com/jquery-load-in-asp-net.html

在 ASP.NET 中使用 jQuery.load() 方法的更多相关文章

  1. 关于IE8中使用Jquery load方法无法正常加载页面

    最近发现,在IE8中使用Jquery load方法时无法正常加载页面,页面显示空白,没有加载.调试发现,页面多了一个</div>标签,但在FF和CH下表现正常.希望能给遇到同样问题的码农有 ...

  2. 使用Jquery.load()方法,出现-此页的状态信息无效，可能已损坏。[转]

    今天遇到此页的状态信息无效,可能已损坏,在以下页面找到解决办法,特记录下来: 转自:http://www.cnblogs.com/liuwenlong/archive/2011/05/09/20410 ...

  3. jquery load() 方法 语法

    jquery load() 方法 语法 作用:当指定的元素(及子元素)已加载时,会发生 load() 事件.该事件适用于任何带有 URL 的元素(比如图像.脚本.框架.内联框架).根据不同的浏览器(F ...

  4. asp.net中导出Excel的方法

    一.asp.net中导出Excel的方法: 本文转载 在asp.net中导出Excel有两种方法,一种是将导出的文件存放在服务器某个文件夹下面,然后将文件地址输出在浏览器上:一种是将文件直接将文件输出 ...

  5. ASP.net中网站访问量统计方法代码(在线人数，本月访问，本日访问，访问流量，累计访问)

    一.建立一个数据表IPStat用于存放用户信息 我在IPStat表中存放的用户信息只包括登录用户的IP(IP_Address),IP来源(IP_Src)和登录时间 (IP_DateTime),些表的信 ...

  6. asp.net中导出Execl的方法

    一.asp.net中导出Execl的方法: 在 asp.net中导出Execl有两种方法,一种是将导出的文件存放在服务器某个文件夹下面,然后将文件地址 输出在浏览器上:一种是将文件直接将文件输出流写给 ...

  7. hiberante中get和load方法的区别

    1.从返回结果上对比: load方式检索不到的话会抛出org.hibernate.ObjectNotFoundException异常 get方法检索不到的话会返回null 2.从检索执行机制上对比: ...

  8. ASP.NET中连接数据库的各种方法

    ASP.NET中连接数据库的各种方法 连接SQL数据库的方法:(一).在Web.Config中创建连接字符串:1.<add name="ConnectionString" c ...

  9. Hibernate中get()和load()方法区别

    get和load方式是根据id取得一个记录下边详细说一下get和load的不同,因为有些时候为了对比也会把find加进来. 1.从返回结果上对比:load方式检索不到的话会抛出org.hibernat ...

随机推荐

  1. select在各个浏览器中的兼容性问题

    我们知道select标签在各个浏览器中的属性和各浏览器的支持各有些不同,从而造成select选择框在各浏览器的显示有不同. 下面我们通过对主要CSS属性的支持,打造全兼容select. 对select ...

  2. javascript模块化应用

    这是一篇关于js模块化历程的长长的流水账,记录js模块化思想的诞生与变迁,展望ES6模块化标准的未来.经历过这段历史的人或许会感到沧桑,没经历过的人也应该知道这段历史. 无模块时代 在ajax还未提出 ...

  3. Android studio使用增量更新进行版本升级

    今天将Android Studio更新了一下,特此记录一下升级过程,以后可能还会用得着. 首先通过菜单栏进入 Help --> Check for update 查看下当前版本是否需要更新.事实 ...

  4. OpenCV 3.1 StereoBM 获取正确视差Dispariy

    OpenCV更新到3.0版本后,Stereo模块变化的挺多的,首先去掉了StereoBMState和StereoSGBMState这两个专门控制BM和SGBM算法参数的类,而且StereoBM不能直接 ...

  5. ado.net 连接，删除，添加

    ado.net数据库访问技术将数据库中的数据,提取到内存中,展示给用户看还可以将内存中的数据写入数据库中去 并不是唯一的数据库访问技术,但是它是最底层的数据库访问技术 数据库: create data ...

  6. nodeType

    nodeType 属性返回节点的类型 语法attrObject.nodeType DOM节点的类型有很多种 12种常用如下 元素节点 : 1属性节点 : 2文本节点 : 3 nodeType取值 No ...

  7. *HDU3496 背包DP

    Watch The Movie Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 65535/65535 K (Java/Others)T ...

  8. 关于网上常见的几种MD5加密的区别

    (1) using System.Security.Cryptography; byte[] result = Encoding.Default.GetBytes(yps); //tbPass为输入密 ...

  9. .net 实现Office文件预览,word文件在线预览、excel文件在线预览、ppt文件在线预览

    转自源地址:http://www.cnblogs.com/GodIsBoy/p/4009252.html,有部分改动 使用Microsoft的Office组件将文件转换为PDF格式文件,然后再使用pd ...

  10. NEC学习 ---- 布局 -三列，右侧自适应

    效果如图 html代码: <div class="g-bd3 f-cb"> <div class="g-sd31"> <p> ...