無限滾動ajax jquery

Question

我正在嘗試實現無限滾動選項。 我正在使用symfony2框架。

html看起來像這樣：

<div id='more' >Loading...</div>
<div id='no-more' >No more results</div>
<div id='result'></div>

控制器：

if($request->isXmlHttpRequest()){
   $appResult = THIS IN AN ARRAY WITH ALL THE RESULTS ......
   $return=array("responseCode"=>400, "appResult"=>$appResult);
   $return=json_encode($return);
   return new Response($return,200,array('Content-Type'=>'application/json'));
}

和javascript：

<script type="text/javascript">
        var page = 1;


        $(window).scroll(function () {
            $('#more').hide();
            $('#no-more').hide();


            if($(window).scrollTop() + $(window).height() > $(document).height() - 200) {
                $('#more').css("top","400");
                $('#more').show();

            }
            if($(window).scrollTop() + $(window).height() == $(document).height()) {

                $('#more').hide();
                $('#no-more').hide();

                page++;

                var data = {
                    page_num: page
                };

                var actual_count = 30;

                if((page-1)* 12 > actual_count){
                    $('#no-more').css("top","400");
                    $('#no-more').show();
                }else{
                     $.ajax({
                        type: "POST",
                        url: "{{ path('login') }}",
                        data:data,
                        success: function(res) {


WHAT I DO HERE????


                        }
                    });
                }

            }


        });

</script>

該代碼工作正常，它發送請求並接收帶有所有結果的響應數組。 但是我不知道如何處理這些結果，如何在結果div中打印它們？

Answer 1

我假設“ res”正在返回HTML，並且您希望該數據進入#result div？ 如果是這樣，請將其放在成功函數中：

$('#result').html($(res));

也許只是

$('#result').html(res);

如果返回的“ res”是JSON，則必須以某種方式對其進行解析，然后將其放入div中。 您能告訴我們res的結果是什么嗎？

編輯：由於它是JSON，因此您可能必須執行以下操作：

var data = $.parseJSON(res);
$.each(data, function(index, value) {
    var currentHTML = $('#result').html();
    $('#result').html(currentHTML + this.description);
});