将内容加载到 div 并在图像单击时滚动到 div 顶部

Question

我在一个页面上有几张图片，当有人点击这些图片时，它会将另一个页面的内容加载到位于页面顶部的 div 容器中。

由于图片位于底部，当内容加载到容器中时，用户可能不知道。我想在加载或加载内容的同时单击图像时自动向上滚动到 div 容器的顶部。

下面是我使用将内容加载到容器中的代码。我似乎找不到任何可以添加的代码，可以让我在加载内容时向上滚动到顶部。

$(document).ready(function(){
    $('nav.main > a').click(function(e){
        e.preventDefault();
        $("#dynamic").load($(this).attr('href') + " .product_content").fadeIn('slow');
    });
});

Answer 1

load() 函数有一个参数，您可以在其中输入回调。请参考documentation。

$(document).ready(function(){
   $('nav.main > a').click(function(e){
    e.preventDefault();
    $("#dynamic").load($(this).attr('href') + " .product_content", ()=>{ window.scrollTo(0, 0) }).fadeIn('slow');
   });
 });

您可以更改scrollTo() 函数以滚动您希望的任何元素，例如$('element').scrollTo(0)。