如何將焦點/滾動條設置爲循環中的第一項？

Question

我有一個搜索表單，當點擊搜索按鈕時，它通過ajax請求獲取數據並附加到div中。現在，當物品返回時，我需要自動換頁到搜索的第一個結果。我該怎麼做？

腳本設置scrollTop的：

$("#search").on("click",function(){ 
    // Handler for .ready() called. 
    $('html, body').animate({ 
     scrollTop: $('#view2').offset().top//instead of #View2, how do I make the page scrolltop to the first item appended in the for loop below? 
    }, 'slow'); 
}); 

當搜索按鈕按鈕點擊，結果被阿賈克斯取出並追加到一個div如下：

$("#searchform").on("submit", function() { 
    //$(this).find(':submit').attr('disabled','disabled'); 
    var data = { 
     "action": "test" 
    };   

    $.ajax({ 
     type: "POST", 
     dataType: "json", 
     url: "search/ajax2.php", 
     data: data, 
     success: function (data) { 
      $(".the-inner-return").append("<a href='search2.php?TID="+ tid +"'>")//need to set the scrolltop here 
     } 
    }); 
}); 

Answer 1

你可以這樣做。

$("#search").on("click",function() { 
    $('html, body').animate({ 
     scrollTop: $("#elementIdToWhichScroll").offset().top 
    }, 'slow'); 
}); 

凡elementIdToWhichScroll是你的第一個元素ID。

編輯代碼 -

success: function (data) { 
     $(".the-inner-return").append("<a href='search2.php?TID="+ tid +"'>"); 

      $('html, body').animate({ 
      scrollTop: $("#elementIdToWhichScroll").offset().top 
     }, 'slow'); 

} 

Answer 2

使用下面的jQuery代碼

$(document).ajaxComplete(function() { 

    $('html, body').animate({ 
    scrollTop: $('#view2').offset().top//instead of #View2, how do I make the page scrolltop to the first item appended in the for loop below? 
}, 'slow'); 

}); 

Answer 3

$("html, body").animate({ scrollTop: 0 }, "slow"); 

使用此代碼獲取結果數據後，您的div id或類。

Answer 4

您需要在動畫中移動到您的AJAX成功回調。然後，您可以使用:last僞代碼獲取該元素中的最後一個錨點（因爲您已將其附加到末尾，prepend需要:first）。

http://jsfiddle.net/onj1yxdq/

success: function (data) { 
    $('.the-inner-return').append("<a href='search2.php?TID="+ tid +"'>"); 
    $('html, body').animate({ 
     scrollTop: $('.the-inner-return a:last').offset().top 
    }, 'slow'); 
}