jQuery 平滑滚动中断与 AJAX 调用

Question

我已经搜索并搜索了导致此问题的原因可能是什么。但每次我搜索时，我都会得到“如何添加平滑滚动”。这不是问题。我有一个 wordpress 设置，并且平滑滚动在每个实例中都可以正常工作，除了从 JS 文件附加的结果。

$(document).ready(function(){
function descriptions(){
    var apiCall = '[APIRUL]';

    $.ajax({
        url: apiCall,
        type: 'get',
        dataType : 'json',
        success: function(data){
            $.each(data, function(i, p) {
                var name = p.name;
                var namelc = p.namelc; //lowercase
                var description = p.description;
                var output = '<div id="' + namelc + '"><h3">' + name + '</h3><p>' + description + '<br /><a href="#table">back to top</a></p></div>';

                $('#description').append(output);
            });
        },
        error: function(xhr, status, error) {
            console.log(error);
        }
    });
}descriptions();
});

一切正常。 jQuery 或 AJAX 本身没有问题。 但由于某种原因，“a href="#table"”“跳转”回表（在描述之上）并添加地址的哈希（例如http://example.com/somepage/#anchor) 而不是缓和它（就像同一页面上的所有其他锚链接一样。即平滑滚动没有任何问题。其他东西在干扰）。

我确信有针对这种行为的解释和解决方案。但我找不到它，因为正如我之前提到的，每次我搜索“平滑滚动不起作用”时，我都会得到大量“如何添加平滑滚动”的结果。

非常感谢任何帮助，无论是全面的还是朝着正确方向轻推的帮助！ /卡住了！

Answer 1

如果您正在使用来自 here 的 JQuery Smooth 滚动，它看起来就像一个监听器一样被处理。如果您使用 AJAX 注入，则该链接上将没有侦听器。重新运行绑定 - 像这样：

$('#description a').smoothScroll();

在代码中的这一行之后：

$('#description').append(output);

Answer 2

所以，感谢彼得马克的回答（谢谢你！真的。我已经坚持了一天多。如果没有你的帮助，它会更长，这是肯定的！）我明白发生了什么这有助于解决问题。目前，无需深入文件层来查看初始平滑滚动的来源（侦听器的名称），这是一个可行的解决方案。将漂亮的平滑滚动带回所有 jQuery 附加元素：D

$('a').click(function(){
    $('html, body').animate({
        scrollTop: $(this.hash).offset().top
    },350,'easeInOutExpo');
    return false;
});

就像 Peter 解释的那样，这需要在 AFTER 追加中进行（否则我们只会针对现有的锚点，而不是我们正在创建/注入的新锚点）。