JQuery 对页面加载的影响

JQuery effect on page load

本文关键字:影响 加载 JQuery      更新时间:2023-09-26

我有一个页面在页面加载中做一些耗时的事情(实际上这就是它所做的一切(。我想向用户展示一条不错的消息,然后在该过程完成后用实际结果替换它。

我尝试的每件事都使UI在漫长的过程结束后呈现,这无济于事。我尝试使用 UpdatePanel 使页面呈现,然后从客户端触发更新,但它也不起作用。

有人可以给我一个如何做到这一点的线索吗?

谢谢

我建议你执行以下操作:

  1. 创建一个新主页,在加载时仅显示您想要显示的任何内容。 加载图形或其他。
  2. 通过 AJAX 调用您的当前页面并让它返回successfailure或任何您想要返回第 1 页的内容。
  3. ajax 调用返回后,您可以将加载图标或 html 替换为成功图形。

网页 1: <div id="content"><img src="images/loading.png" alt="loading" /></div>

j查询:

$.ajax({
    type: "GET",
    timeout: 30000,  // set accordingly
    url: "/some/url", // this is the page that will do all the work
    beforeSend: function() {
      // do some stuff
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
      alert("An error has occurred making the request: " + errorThrown); // if there was an issue
    }, 
    success: function() {
    $('#content').html('Success!!'); // change icon or what you need to do.
    }
    });

我无法让 UI 正确格式化代码。 Jquery ajax reference: http://api.jquery.com/jQuery.ajax/

你可以使用 jQuery BlockUI 插件 - 在你的就绪处理程序中,你会阻止、处理然后取消阻止。

如果有大量数据流向客户端,则在就绪处理程序启动并阻止页面之前,可能会有一个不舒服的时期,因此另一种策略是使用一个覆盖页面的<div>(其中包含"请稍候,加载"消息(,隐藏在就绪处理程序的末尾。

如果您使用的是 ASP.NET WebForms,则可以使用UpdatePanel和UpdateProgress在加载内容时显示图像。只需将更新进度控件指向更新面板控件即可。更新进度将包含加载图像和更新面板的主要内容和控件。但是,UpdateProgress 和 UpdatePanel 是Microsoft编写的丑陋工具,我会强烈重申使用 jQuery 及其真正的 AJAX 调用(尽管它会涉及更多工作(