如何使用jQuery禁用Div加载

How Do I Disable A Div From Loading with jQuery?

本文关键字：Div 加载 禁用 jQuery 何使用      更新时间：2023-09-26

我想做的是让我的网站显示10条帖子，然后询问用户是否想加载"下一页"。我想让这个"下一页面"按钮在用户点击时加载内容。

我希望div根本不完全加载的原因是为了网站速度。如果我的网站点击了100条帖子，即使我只是使用了一个简单的.hide();功能或其他什么，那么网站仍然需要花费时间来加载网站隐藏的90条帖子。

是的，我确实意识到，如果我担心页面性能，我可以在每次发布10篇帖子时创建新页面，但这似乎需要很多时间，而且非常令人困惑，因为它无法正常工作或出现问题。

你不能。如果它在HTML文档中，那么它将被发送到浏览器。到那时再阻止它装载就太晚了。

阻止加载div内容的唯一方法是首先不要在文档中包含div，然后从服务器中获取更多数据（您通常会使用指向下一个页面的链接来执行此操作，也可以选择使用JavaScript来逐步增强功能，以使用Ajax加载额外的数据）。

您需要使用XHR或Ajax请求来获取接下来的10篇文章，这样做要好得多，而不是隐藏它们并根据需要激活它们，因为即使隐藏它，浏览器也必须下载内容。

您应该首先只显示一些帖子，然后根据需要使用XHR/Ajax加载更多帖子。

jQuery提供了一些简单的.ajax函数，可以帮助您根据需要检索数据。

AJAX是您的最佳选择。

根据您的需要，您可以通过以下两种方式：

  1. 让AJAX在用户单击按钮后立即加载更多的帖子。

  2. 页面加载后（JQ-ready函数），您就可以调用AJAX来获取更多的10篇文章，并将它们打印在DOM隐藏元素中，或者将它们保存在某个变量中以备将来使用。在你成功地恢复了帖子（AJAX.success（））之后，你可以再次调用AJAX函数并再次运行它，让它重复这个过程，直到它缓存say。。。在一个变量中发布100个帖子或将其打印到DOM元素中。

您可以在每次用户单击按钮时执行ajax调用，并使用jquery 将结果附加到页面上的最后一个div

$( ".container" ).append( $( "div" ) );

如果你想创建一个页面，它不会一次加载所有内容，也不会让用户点击按钮，你可以使用lazyloading。

它是为加载图像而开发的，但也可以用于加载div。参见Div 的Layz加载

这既适用于用户向下滚动时，也适用于用户导航到另一个页面然后返回时，它将只加载可见页面的一部分。也就是说，如果它们在底部，并且向上滚动，它将重新加载上面的div。

相关文章：