Rails:如何向用户预加载消息

Rails: How to preload a message to user

本文关键字：加载 消息 用户 Rails      更新时间：2023-09-26

我有一个基于Rails的预发布网站，它有一些旋转的背景图像（这对推销网站的理念很重要），加载时间太长，以至于用户在加载之前就离开了网站。他们唯一看到的是电子邮件提交框。

有什么好方法可以向用户显示一条消息，即网站需要一段时间才能加载，但在一段合理的时间后该消息就会消失。我猜jQuery fadeOut（）有一个计时器，但我不确定该设置多长时间的计时器，因为我不确定它什么时候开始计数。

有什么建议吗？

我以前在我编写的应用程序中遇到过这样的情况，所以希望我的建议能有所帮助！我会：

  1. 加载一个尽可能简单的非常基本的DOM标记。Barebones没有外部加载的资产，只有纯html标签和css。这应该很快加载。有一个div，其中包含某种消息，让用户知道图像正在加载（例如<div class = 'loading_images'>loading...</div>）
  2. 既然您提到了jQuery，我假设您可以访问它，否则您可以只使用标准的Javascript。这里的想法是检索您试图使用AJAX加载的图像，将图像插入到检索后需要放入的任何DOM元素中，然后在完成所有操作后忽略加载消息。这样，您就不必担心设置计时器和猜测完成请求需要多长时间。一旦请求完成，您就可以取消加载消息，继续您的快乐之路。无论在哪里包含jQuery，都要在document.ready处理程序中放入类似的内容
$（document）.ready（function）{var请求=$.ajax({url:url_to_your_image，类型："GET"，成功：函数（数据）{$（whatever_context_or_div_to_insert_your_image）.html（数据）$（'.loading_images'）.hide（）}})；})

此代码将等待DOM加载，然后创建一个新的AJAX请求来检索要插入页面的图像。如果成功加载了图像，则会使用图像（名为"data"的变量）调用success方法，然后将其插入到您希望的位置。最后，加载消息是隐藏的，这样用户就可以与页面及其内容进行充分的交互。

这里有两件重要的事情需要注意：

  • 按照目前的情况，如果请求失败，代码将不会做任何事情（例如，图像没有通过AJAX成功加载）。关于如何处理这种情况，请参阅$.ajax和错误回调的jQuery文档
  • 按照上面代码片段的编写方式，将只加载一个图像。为了快速加载任意数量的图像，您可以将AJAX请求包含在For循环中，并以这种方式加载图像。不过，这不是一个好的做法，所以我建议您考虑创建一个单独的图像精灵，通过AJAX只检索该图像精灵，然后使用CSS从较大的图像中剪切较小的图像
相关文章：