Question

我用砖石来安排＆＃34; item＆＃34;分成一个更大的容器＆＃34;一。我有一个简单的PHP脚本（refresh.php），它返回一个div元素列表，从sql查询中填充。基本上是：

<?php
echo "<div class='item'> xxxx </div>";
echo "<div class='item'> xxxx </div>";
echo "<div class='item'> xxxx </div>";
echo "<div class='item'> xxxx </div>";
?>

当我点击链接时，我想在我的主html页面上加载这些元素，所以我添加了这个脚本：

<script type="text/javascript">
   function updaten() {
      $('#container').load('refresh.php');
   }
</script>

然后我在html页面中添加了一个链接来运行脚本：

<a href="#" onClick="updaten()" > Update! </a>

然后在下面是带有容器div的其余html代码：

<div id='container' class='masonry js-masonry' data-masonry-options='{ "columnWidth": 500, "itemSelector": ".item" }'>

</div>
<script src="masonry.pkgd.js"> </script>
<script src="jquery-1.10.1.js"> </script>
</body></html>

如果我加载页面并单击＆＃34;更新！＆＃34;，结果将显示在页面上，但布局完全错误。物品之间有很多垂直间隙，高度不规则（但宽度均为500px）。我无法获得一个漂亮的，无间隙的布局（当我将php页面生成的代码复制/粘贴到html源代码中时，我会得到它。）

我尝试通过将其中一个添加到updaten（）函数来强制重新加载，但它不起作用：

$('#container').masonry( 'reloadItems' );
$('#container').masonry( 'layout' );

控制台告诉我＆＃34;砌体＆＃34;是一种未知的财产或方法。

我也试过这个：Reloading masonry content 但没有成功。

如何在不重新加载页面的情况下重新加载砌体，以便正确排序我的元素？

在砌体中动态加载内容

0 个答案: