0

我试图抓取项目，用 Javascript 组织，并将它们放在我的页面内容上。我遇到的问题是，当我使用 时.load()，它不抓取任何 javascript，所以我抓取的图像不在正确的组织中。

这是我用来抓取内容的函数：

function loader(url) {
    $.get(url, function(data) {
        $('#posts').fadeOut('normal',function(){$('#posts').html(data);});
        $('#posts').fadeIn('normal');
    }).error(function(url) {
        alert('error');
    });
};

经过研究，似乎为了获得 javascript 我需要使用 Ajax

事情是这样的：

我的页面上有完全相同的 javascript 代码，即未应用的其他页面的 javascript。有没有办法可以将此 javascript 应用于加载的项目.load()？

提琴手

4

2 回答 2

1

Masonry 要求您在添加或删除元素时告诉它，以便它可以相应地自行处理。有两种方法可以做到这一点：

  1. 销毁 $wall 的 Masonry，替换 $wall 的 HTML，在 $wall 上构建 Masonry
  2. 使用 Masonry 摧毁 $wall 的孩子，使用 Masonry 将新的孩子添加到 $wall -我在实现这个时遇到了麻烦，因为它无法正确对齐

在第一个示例之后，我进行了一些更改。JSFiddle

id="entry"更改了toclass="entry"和#entryto的所有实例.entry。ID 一次只能由一个元素使用，而为此目的存在一个类。

过滤返回的 HTML 以仅包含 #posts 的子项。我们不想包含<html>...<head>...</head><body>....

$newPosts = $(data).filter(function(){
    return this.id === 'posts';
}).children();

破坏砌体，更新 HTML，重新加载砌体

$wall.masonry('destroy');
$('#posts').html($newPosts);
$wall.masonry({
    itemSelector: '.entry, .entry_photo',
    isAnimated : false
});
于 2013-06-22T00:44:44.767 回答
0

jQuery Masonry 负责不同项目的布局。但是您只在页面加载时调用 masonry 函数一次。要解决您的问题，您只需要在加载新项目后再次调用 masonry - 因此在函数“loader”中的 AJAX 调用中编写您已经做过的内容：

$wall.masonry({
   itemSelector: '#entry, #entry_photo',
   isAnimated: false
});

您还可以改进代码，例如使用 $wall 变量而不是 $("#posts")。

于 2013-06-21T23:51:56.750 回答