Question

我们在页面http://site.com/movies/#posters

<div class="content">
    <div id="posters"></div>
</div>

我正在尝试使用此代码，以跳转到ID为posters的块并向其添加类active：

$(location.hash).addClass("active");

效果很好，但有问题。如果有<a href="http://site.com/movies/actuale/#posters">Actuale</a>之类的链接，则会跳转到此链接，而不是<div id="posters"></div>

应该在id="posters阻止内的class="content"跳转到阻止。

<div id="posters"></div>应该成为<div class="active" id="posters"></div>

怎么做？

感谢。

Answer 1

您必须滚动到元素并阻止链接触发。

创建一个函数来执行此操作：

function ScrollToHash() {
    var posX = 0, posY = 0;
    var obj = document.getElementById(document.location.hash);
    while(obj) {
        posY += obj.offetTop;
        posX += obj.offsetLeft;
        obj = obj.offsetParent;
    }
    window.scrollTo(posX, posY);
}

您还必须在链接中添加onclick处理程序：

<a href="#posters" onclick="ScrollToHash(); return false;">Link</a>

唯一的问题是，document.location.hash为您提供当前页面的hash值，而不是链接。你必须找到一种不同的方法来做到这一点。

我可能误解了你想要做的事情，所以希望这至少可以指出你正确的方向。

Answer 2

很高兴，我认为您必须使用重复的ID。 $('#posters')将选择包含id="posters"的元素，而不是仅包含#posters的{{1}}属性的链接。我建议您查看HTML并确保该链接实际上不是ID href。

在块内搜索location.hash

2 个答案: