似乎无法在blazer中调用javascript

Question

我正在尝试使用JSinterop，但它似乎不起作用。

我正在尝试使用这个代码笔示例实现一个返回顶部按钮https://codepen.io/rdallaire/pen/apoyx

我已经将CSS和Javascript文件添加到主机文件中。。当加载网站时，它们会被购买到屏幕中。但这个按钮从未出现在我的屏幕上。

不得不稍微推一下JS，以便JsInterop 可以调用它

// ===== Scroll to Top ==== 
function scrollToTopFunc() {
$(window).scroll(function() {
if ($(this).scrollTop() >= 50) { // If page is scrolled more than 50px
$('#return-to-top').fadeIn(200); // Fade in the arrow
} else {
$('#return-to-top').fadeOut(200); // Else fade out the arrow
}
});
$('#return-to-top').click(function() { // When arrow is clicked
$('body,html').animate({
scrollTop: 0 // Scroll to top of body
},
500);
});
}

添加到我的页面

@inject IJSRuntime JS;

以及对javascript 的调用

protected override async Task OnAfterRenderAsync(bool firstRender)
{
await JS.InvokeVoidAsync("scrollToTopFunc");
}

并将标签添加到页面

<a href="javascript:" id="return-to-top"><i class="icon-chevron-up"></i></a>

现在，当我加载页面时，我在谷歌开发工具中没有得到任何错误。真的很困惑。有人能给我指正确的方向吗？

Answer 1

我最终在不使用javascript文件的情况下完成了以下

<按钮类＝"；newHomeButton newHomeButton—辅助"；数据ste分量＝"；转换主"；aria标签＝">onClick="；document.getElementById('main'(scrollIntoView(｛behavior:'smooth'｝(">cur>

我只是把我的标题包装在一个div中，id＝"；主"；这份工作做得很好。