Question

我在网站上有两个div面板（left_panel和right_panel）。左侧面板有数百种食品，右侧面板有一小盒订单，我们可以看到用户从左侧面板添加了多少项目。现在的问题是当页面加载时左侧面板需要很长时间才能从数据库中获取数据，并且当它完全加载时会显示右侧面板。是否有任何jquery帮助我可以在左侧面板或网站上的任何其他内容之前加载正确的面板？

Answer 1

那里有一些东西

左侧面板有数百个食品，右侧面板有小盒子我们可以看到用户从左侧添加了多少项目面板。

您可以使用分页，建议/推荐或搜索来推迟加载部分数据。我没有用户将有非常愉快的经验，从数百条记录中侦察reqd项目

页面加载左侧面板需要很长时间才能从数据库中获取数据

当html开始渲染时，已经完成了从数据库中获取记录，除非您稍后推迟从XHR / Ajax请求执行此操作。即使它是通过AJAX完成的，它也会同时完成，并且可能不会严重影响其他DOM元素的加载。

我会：

首先加载右侧面板。
通过AJAX加载左侧面板并实现分页或实时搜索功能。

Answer 2

最初隐藏右列，并在你的ajax函数（或你正在加载内容的任何内容）中放置一个回调，使右列可见。

Answer 3

我建议在主页加载后使用AJAX加载左侧内容。基本概念是左侧面板为空，右侧面板填充为页面的核心HTML。然后，当在浏览器中加载页面时，使用AJAX（jQuery.load）来引入左侧列的内容。

Answer 4

 $(document).ready(function() {
  $("div").show(); 
});

在Css隐藏div右边

或者用ajax加载，并在完成后显示div对吗？

$.ajax({
  url: "test.php",
//stuff
}).done(function() {
 $("#rdiv").show(); 
});

Answer 5

$(function)() {
  $("#left").load("leftcontent.html");
});

<div id="right" style="float:right">....</div>
<div id="left"></div>

Answer 6

如果您在尝试加载的div上使用.load(callback)方法，然后将该函数用于在回调中呈现页面的其余部分，它将执行您想要的操作。请注意，这是一种与基于URL加载数据的方法不同的jQuery加载方法。

参考：http://api.jquery.com/load-event/

如何在网站上的任何其他内容之前加载特定的div？

6 个答案: