Question

我有一个正在查看的书籍的图片库。当有人点击页面上的一本书时，我会在顶部的iframe中定位我的属性以加载该书的评论。

<iframe height="300px" width="100%" src="" name="iframe_reviews"></iframe>

<li class="one_quarter"><a href="b_reviews/book4.html" target="iframe_reviews"><img src="b_reviews/images/book4.jpg"></a></li>

该代码可以正常工作。我遇到的麻烦是页面上有几本书。这意味着您需要向下滚动才能看到书籍，如果您单击某本书，则该书籍会加载到iframe中，但是您无法确定它是否已存在...您仍然停留在页面底部。

单击链接后，是否可以将_top定位为目标，以便将书评加载到iframe中，并使页面同时滚动回到顶部？谢谢。

Answer 1

您应该能够使用Javascript函数和DOM属性'scrollTop'进行操作。只需为链接分配一个Javascript函数（使用'onClick'事件，因此在单击链接时调用该函数）即可将该属性设置为0（document.body.scrollTop = 0）。

HTML：

<a href="b_reviews/book4.html" target="iframe_reviews" onclick="scrollToTop()">...</a>

Javascript：

function scrollToTop() {
    document.body.scrollTop = 0;
}

或者，您可以为标签分配一个ID，然后使用功能getElementById。

HTML：

<a href="b_reviews/book4.html" target="iframe_reviews" id="book">...</a>

Javascript：

document.getElementById('book').onclick = function(){
   document.body.scrollTop = 0;
};

如何滚动到顶部并加载iframe

1 个答案: