javascript - 如何让 AJAX 在 div 顶部加载页面

Question

我的网站包含一个 div，其中使用 ajax 加载不同的页面。单击按钮后，可以加载新页面，并且页面始终显示在该 div 中。

问题是，如果我转到一个新页面并向下滚动而不滚动回该页面顶部，则新页面将加载到页面顶部下方的相同位置，而不是页面顶部。我想强制所有页面在顶部加载。

以下是相关页面元素:

div(页面内容所在的位置):

<div class="main_text">
<div id="C2"><span style="color:black">MTX</span></div>
</div>

按钮:

<div class="C1"><br><button class="button_01" id="btn07" onclick="HideDropdown(); ShowAjax(7);">Page 7</button></div>

AJAX 代码:

<script>
function ShowPage(type) {
    var filename = "page_" + type + ".htm"
    $( "#C2" ).hide().load( filename ).fadeIn(500);
}
</script>

最重要的一行是:

$( "#C2" ).hide().load( filename ).fadeIn(500);

在每个页面的顶部我有:

<div id="bkmk00"></div>

我想在页面顶部打开每个页面(位于“bkmk00”)。我看到一篇文章说我可以添加一个 ID 名称，它将加载该 ID 处的页面:

$( "#C2" ).hide().load( filename "bkmk00" ).fadeIn(500);

但是这样，它就不会加载任何东西。相反，对于此 ajax 函数调用，Firefox 67 开发控制台会显示“SyntaxError:参数列表后缺少 )”，并且它指向文件名后面的字符 37。看来我无法添加第二个参数“bkmk00”。

我的问题是，如何才能在要加载的页面顶部的“bkmk00”处加载页面？

Answer 1

<script>
function ShowPage(type) {
    var filename = "page_" + type + ".htm"
    $( "#C2" ).hide().load( filename ).fadeIn(500);
}
</script>

你已经很接近了，但还不够，加载函数有 2 个参数，输入文件和函数回调:

var filename = "page_" + type + ".htm"
$( "#C2" ).hide()
$( "#bkmk00" ).load(filename, function(){
    $( "#bkmk00" ).fadeIn(500);
});