如何使AJAX加载div顶部的页面

时间:2019-07-03 21:16:15

标签: javascript jquery ajax

我的网站包含一个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);

但是,它不会加载任何内容。取而代之的是,Firefox 67开发人员控制台针对此ajax函数调用说“参数列表后缺少SyntaxError:缺少),它指向紧随文件名之后的字符37。看来我无法添加第二个参数“ bkmk00”。

我的问题是,如何才能将页面加载到要加载页面顶部的“ bkmk00”?

1 个答案:

答案 0 :(得分:1)

#include "moduleA/header"

您很亲密但不太完全,加载函数具有2个参数,即输入文件和函数回调:

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