jQuery-massy-AJAX返回的数据在被追加后没有拾取massy网格布局

当我将AJAX返回的数据附加到我的容器中时，它不会拾取已经应用于先前加载的项的网格布局。我正在使用包装在文档就绪函数中的以下代码：

// Masonry
var $container = $('#masonry-container');
$container.imagesLoaded(function () {
    $container.masonry({
        itemSelector: '.grid_4',
        isAnimated: true
    });
});

// AJAX Fotolia Image Search
var morebtn = $('.get-more-results');
var sOffset = 50;
morebtn.on('click', function () {
    var $cst = $('.crrsrch').text();
    $.ajax({
        type: "POST",
        url: "...",
        data: {};
        success: function (data) {
            $container.imagesLoaded(function () {
                $container.append(data);
                $container.masonry('appended', data);
            });
        }
    });
    return false;
});

window.setTimeout(masonriniate, 500);

AJAX调用中的项被追加，但它们没有砌体布局——它们被浮动在列表的顶部，而不是被追加。正在将数据追加到标记中

使用砌体附加方法也会引发错误。我在控制台中得到以下信息：

Uncaught TypeError: Property 'webkitMatchesSelector' of object is not a function
    i
    r._filterFindItemElements
    r._getItems
    r.addItems
    r.appended
    t.fn.(anonymous function)
    (anonymous function)
    doneLoading

除了最后两个（（匿名函数）和doneloadding）之外，它们都与砌体js文件有关

通过在砌体现场使用方法文件，这应该是可行的。很明显，我遗漏了一些东西

可能有帮助的额外信息- -AJAX调用是对Fotolia API的调用 -该网站建立在Wordpress 3.5.2上 -javascript文件正在排队

如果任何人有任何想法或可以提供一些帮助，将不胜感激

---

非常感谢。

在加载内容的同时，尝试在函数中声明Mashise itemselector（成功），这与我遇到的应用$container.Mashise（“重新加载”）的情况类似

例如：

函数（数据）{

//将收到的数据追加到元素中

$container.append（data）.mashise（'reloadeitems'）.mashise（'layout'）；}

---

试试这个，这对我很有用。

在砌体上实现重新加载功能的最佳方法是完成以下步骤：

1-生成这样的函数（我们稍后将使用此函数）

2-在启动ajax调用之前，在脚本中完全如下所示：

$('#news').masonry('destroy');

3-在ajax完成后，使用.ajaxComplete（handler）等方法或任何等待ajax调用完成的事件侦听器运行此函数：

// Masonry
var $container = $('#masonry-container');
$container.imagesLoaded(function () {
    $container.masonry({
        itemSelector: '.grid_4',
        isAnimated: true
    });
});

// AJAX Fotolia Image Search
var morebtn = $('.get-more-results');
var sOffset = 50;
morebtn.on('click', function () {
    var $cst = $('.crrsrch').text();
    $.ajax({
        type: "POST",
        url: "...",
        data: {};
        success: function (data) {
            $container.imagesLoaded(function () {
                $container.append(data);
                $container.masonry('appended', data);
            });
        }
    });
    return false;
});

window.setTimeout(masonriniate, 500);

请记住，如果正在进行任何类型的转换或动画，则超时非常重要，只需将超时毫秒数设置为大于动画超时毫秒数即可

happy Coding在这里清楚地解释了应该将响应包装在jquery对象中，然后追加。更改代码的这一部分

success: function (data) {
    $container.imagesLoaded(function () {
        var $data = $(data);
        $container.append($data);
        $container.masonry('appended', $data);
    });
}

---

将解决问题。

我也有同样的问题。有人知道如何解决这个问题吗？谢谢你，我会尝试一下，让你知道它是怎么回事。