jquery - escape_javascript 后的砌体

Question

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

渲染代码相当简单，div Masonry 应该可以工作:

<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

然后，在 View Javascript 中，我重新渲染 div，如下所示:

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

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

刷新后，会显示警报“Hey”，这意味着该事件已被触发并捕获得很好。然而，Masonry 被调用，它似乎正在重新附加内容，但没有订购它。为了测试这一点，我还尝试使用链接手动触发 Masonry，并且在调用 escape_javascript 后它也停止工作。当然，如果我尝试在没有 escape_javascript 的情况下渲染部分内容，则不会刷新任何内容。

我需要某种方法来渲染部分而不转义 javascript，或者说明如何在转义 javascript 后使 Masonry 运行。请注意，当按上述方式重新声明时，其他 JQuery 组件可以在相同的环境中正常工作。

提前致谢。

Answer 1

添加元素后尝试使用“附加”方法

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