无法让Isotope使用AJAX(代码示例)

我正在尝试整合同位素,但是我在使用ajax时遇到了问题.

这是代码

<script type="text/javascript">

var currentPage = 1;

$(function(){
    var getUrl = 'loadMovies.PHP';
    var getQuery = 'genrefilter='+movieSelection.elements["genreFilter"].value;
    getQuery += '&yearfilter='+movieSelection.elements["yearFilter"].value;
    getQuery += '&titlesort='+movieSelection.elements["titleSort"].value;
    getQuery += '&ratingsort='+movieSelection.elements["ratingSort"].value;
    getQuery += '&yearsort='+movieSelection.elements["yearSort"].value;
    getQuery += '&runtimesort='+movieSelection.elements["runtimeSort"].value;
    getQuery += '&currentPage='+currentPage;

    var $container = $('#movieBox');
    //$container.isotope({itemSelector: '.movie'});

    $.ajaxSetup({cache:false});  
    var ajax_load = "<img class='loading' src='images/load.gif' alt='loading...' />";

    //$("#genreFilter").change(function(){$container.isotope('insert',ajax_load).load(getUrl,getQuery);});


    $("#genreFilter").change(function(){$('#movieBox').html(ajax_load).load(getUrl,getQuery);});
});

HTML只是“”

随着同位素线的评论,我实际上得到了按预期显示的div,但由于我无法弄清楚如何在同位素线上工作,我无法让它工作.

我试图将同位素与“插入”方法结合起来,我在没有ajax的情况下开始工作.

摘自:http://isotope.metafizzy.co/docs/adding-items.html

“插入方法

更有可能的是,您希望使用insert方法,该方法执行addItems未命中的所有操作. insert会将内容附加到容器,过滤新内容,对所有内容进行排序,然后触发reLayout,以便正确布置所有项目元素.

var $newItems = $('<div class="item" /><div class="item" /><div class="item" />');
$('#container').isotope( 'insert',$newItems );

最后一行是我需要与ajax线集成,但我只是没有看到我可以放置它.我尝试了几种方法,其中一种方法显示在注释掉的行中.

有谁能看到这个问题?

得到这样的工作:
$(function(){

        var $container = $('#movieBox');

        $container.isotope({
            itemSelector: '.movie'
        });

        $.ajaxSetup({cache:false});  
        var ajax_load = "<img class='loading' src='images/load.gif' alt='loading...' />";

        $('#genreFilter').change(function(){

$('#genreFilter').change(function(){

            var getQuery = 'loadMovies.PHP?';
            getQuery += 'genrefilter='+movieSelection.elements["genreFilter"].value;
            getQuery += '&yearfilter='+movieSelection.elements["yearFilter"].value;
            getQuery += '&titlesort='+movieSelection.elements["titleSort"].value;
            getQuery += '&ratingsort='+movieSelection.elements["ratingSort"].value;
            getQuery += '&yearsort='+movieSelection.elements["yearSort"].value;
            getQuery += '&runtimesort='+movieSelection.elements["runtimeSort"].value;
            getQuery += '&currentPage='+currentPage;

            return $.ajax({
                cache:false,url: getQuery,success: function(data){$container.isotope('insert',data)}
                });
            });

    });

相关文章

IE6是一个非常老旧的网页浏览器,虽然现在很少人再使用它,但...
PHP中的count()函数是用来计算数组或容器中元素的个数。这个...
使用 AJAX(Asynchronous JavaScript and XML)技术可以在不...
Ajax(Asynchronous JavaScript and XML)是一种用于改进网页...
本文将介绍如何通过AJAX下载Excel文件流。通过AJAX,我们可以...
Ajax是一种用于客户端和服务器之间的异步通信技术。通过Ajax...