• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    Ajax实现静态刷新页面过程带加载旋转图片
    复制代码 代码如下:

    !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 id="Head1" runat="server">
    meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    link href="/Style/NiuLan.css" rel="stylesheet" type="text/css" />
    title>/title>
    script type="text/javascript">//当刷新的时候 原先的页面的展示数据不会隐藏这里面是隐藏函数
    //取得PageRequestManager对象,每一个Asp.net Ajax页面中会右唯一一个这种对象负责处理所有的Async - Postback要求
    var prm = Sys.WebForms.PageRequestManager.getInstance(); //新增事件处理至PageRequestManager的initializeRequest事件,当Async-Postback发生时,此事件会被触发,我们的InitRequest函数便会被运行    
    prm.add_initializeRequest(InitRequest);
    //新增事件处理至PageRequestManager的endRequest事件,当Async-Postback完成时,此事件会被触发,我们的EndRequest函数便会被运行   
    prm.add_endRequest(EndRequest); function InitRequest(sender, args) {
    //显示出UpdateProgress1控件
    document.getElementById('detail').style.display = "none";
    }
    function EndRequest(sender, args) {
    //隐藏UpdateProgress1控件
    document.getElementById('detail').style.display = "block";
    }
    //用于取消Async-Postback动作
    function CancelClick() {
    //当处于Async-Postback动作时,get_isInAsyncPostBack函数会回传true,此时调用abortPostBack 函数便会取消Async-Postback动作。
    if (prm.get_isInAsyncPostBack()) {
    prm.abortPostBack();
    }
    }
    /script>
    /head>
    body >
    form id="Form1" runat="server">
    //使用  Ajax Extensitons 中的ScriptManager
    asp:ScriptManager runat="server">
    /asp:ScriptManager>
    //使用地方比如
    asp:UpdatePanel ID="UpdatePanel1" runat="server">
    ContentTemplate>
    //放代码
    div id="detail">asp:ImageButton ID="ibtnFBSJ" runat="server" ImageUrl="/images/ershoufang/bs/fbsj.gif"
    OnClick="ibtnFBSJ_Click" />
    /div>
    //当在静态刷新页面的时候会调用UpdateProgress 但是这个后台也是需要代码的看下面
    asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
    ProgressTemplate>
    div style="text-align: center">
    img alt="" src="/images/loading.gif" />
    /div>
    /ProgressTemplate>
    /asp:UpdateProgress>
    /ContentTemplate>
    /asp:UpdatePanel>
    /form>
    /body>
    /html>
    后台
    protected void ibtnFBSJ_Click(object sender, ImageClickEventArgs e)
    {
    System.Threading.Thread.Sleep(2000);
    drpSortOrder.SelectedValue = ((int)ErShouFangJiChuZuFang.order.按发布时间排序).ToString();
    PopulateDetails();
    }
    //这样就可以实现为静态刷新页面,带加载过程中有旋转图片,用户体验会很好效果如下

     
    当然你也可以使用jquery或者ajax写动态加载table的方式来实现
    您可能感兴趣的文章:
    • Ajax添加数据与删除篇实现代码
    • jQuery之ajax删除详解
    • jquery ajax实现批量删除具体思路及代码
    • PHP+ajax 无刷新删除数据
    • Ajax方式删除表格一行数据示例代码
    • 使用ajax加载的页面中包含的javascript的解决方法
    • 滑轮滚动到页面底部ajax加载数据配合jsonp实现探讨
    • jQuery Ajax页面局部加载方法汇总
    • 基于jquery的finkyUI插件与Ajax实现页面数据加载功能
    • ajax实现页面加载和内容删除
    上一篇:JavaScript如何控制Session实现原理及代码
    下一篇:利用AjaxControlToolkit实现百度搜索时的下拉列表提示详细步骤
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯

    时间:9:00-21:00 (节假日不休)

    地址:江苏信息产业基地11号楼四层

    《增值电信业务经营许可证》 苏B2-20120278

    Ajax实现静态刷新页面过程带加载旋转图片 Ajax,实现,静态,刷新,页面,