Question

我正在使用带有Rails应用程序的Masonry来渲染一个充满图像的屏幕。我的问题是在某些时候我使用远程AJAX表单进行调用，后来刷新了div。在那之后，调用Masonry就会停止工作，调用它就好像没有定义Masonry一样。

渲染的代码相当普通，而div砌体应该可以使用：

<div id="pins">
  <%= render @pins %>
</div>

我正在呈现的部分只显示了Rails模型，如下所示：

<div id="pin-<%= pin.id %>" class="box">...</div>

在第一页加载Masonry的代码加载：

jQuery ->
    $('#pins').imagesLoaded ->
        $('#pins').masonry itemSelector: ".box", isAnimated: true

然后，在Javascript视图中，我按如下方式重新渲染div：

$("#pins").html("<%= escape_javascript render @pins %>");

$('#pins').imagesLoaded(function() {
    alert("Hey");
    return $('#pins').masonry({
          itemSelector: ".box",
          isAnimated: true
    });
});

刷新后，会显示警告“嘿”，这意味着事件被触发并被捕获。然而，砌体被调用，它似乎是重新附加内容但没有订购它。为了测试这个，我还尝试使用链接手动触发Masonry，并且在调用escape_javascript后它也停止工作。当然，如果我尝试使用escape_javascript渲染部分内容，则不会刷新任何内容。

我需要一些方法来渲染部分而不转义javascript或有关如何在javascript被转义后使Mason工作的说明。请注意，与上面重新声明时，其他JQuery组件的工作方式相同。

先谢谢。

Answer 1

尝试使用＆＃34;追加＆＃34;添加元素后的方法

http://masonry.desandro.com/methods.html#appended

Answer 2

只需触发重新加载元素，如：

$(document).ajaxComplete -> $(element).masonry()

如果尝试在$（元素）

上捕获ajaxComplete，

将无效

在escape_javascript之后的砌体

2 个答案: