使用变量设置具有动画功能的 ScrollTop

Question

我有一系列折叠和打开的 div，我希望浏览器滚动到打开的 div 的顶部。

我正在尝试使用锚链接并将锚链接保存在变量“scrollClass”中，但我的代码无法正常工作。但是，当我测试控制台日志时，它会准确地输出我希望它输出的内容。我不确定这是否是一种语法情况。

如果我能在这里得到任何帮助，我将不胜感激。

提前致谢。

<script>
$('.discover-btn-open, .discover-btn-open a').click(function(e) {
e.preventDefault();
var currentElement = $(document.activeElement);
var scrollClass = $(this).closest('.discover-inner').find('#discover- anchor').attr('href');
$(".discover-inner").removeClass("discover-inner-open");
$(this).closest(".discover-inner").addClass("discover-inner-open");
console.log(scrollClass);
$('html, body').animate({scrollTop: $(scrollClass).offset().top - 100}, 450);
});

$('.discover-close, .discover-close a').click(function(e) {
e.preventDefault();
$(this).closest(".discover-inner").removeClass("discover-inner-open");
});

</script>

Answer 1

您正在将属性href 设置为scrollClass，当您尝试将其用作元素时，它将不起作用。尝试删除attr("href") 部分，然后使用.offset。

您也可以通过 jQuery 触发对要滚动到的 anchor 元素的点击。