Django直接跳到div

Question

我正在尝试设置链接，通过如下所示的URL，可以在Django应用程序中直接跳转到页面加载的相关div。

Mysite.myDomain/faq9#faq9-1

下面是一个常见问题的例子：

<div class="panel-group" id="faq-9">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#faq9-1">
                    9.1 FAQ Title here.
                </a>
            </h4>
        </div>
        <div id="faq9-1" class="panel-collapse collapse">
            <div class="panel-body">
                 Body of FAQ here.
            </div>
         </div>
    </div>

当然，简单地加载相关的URL没有什么作用，用href="#faq9-1"和/或id="faq9-1"替换name="faq9-1"不会改变这一点。因此，我想可能有一些jquery可以做到这一点：

<script type="application/javascript">
$(document).ready(function () {
    var faq = window.location.href.split('#')[1];
    if (faq) {
        console.log("Got FAQ: " + faq);
        if(faq.match(/^faq/)) {
            $('html, body').animate({
                scrollTop: $("#" + faq).offset().top
            }, 2000);
        }
    }
});
</script>

不过，...still什么也没有。我甚至无法从控制台窗口得到触发跳转的任何东西。我也尝试过这个插件：

https://github.com/flesler/jquery.scrollTo

...and在控制台上尝试了上面的插件和方法。还是一无所获。想必我遗漏了一些显而易见的东西，所以我欢迎任何建议。

Answer 1

最终通过以下方式成功地实现了这一目标。首先，通过添加另一个ID参数：

<a data-toggle="collapse" data-parent="#accordion" href="#faq1-2" id="faq1_2">

该方法修正了将相关部分移至顶部的问题，但随后需要一些javascript将从横幅下查看的部分移出，并扩展视图：

$(window).load(function () {
        if (window.location.hash) {
            var faq = window.location.href.split('#')[1];
            var tbody = faq.replace(/_/,'-');
            $('#' + tbody).addClass("in");
            window.scrollBy(0,-160);
        }

    });

Answer 2

我不能看到您所有的html，但是如果您的页面没有滚动(在页面上没有足够的信息需要滚动条)，那么页面就不会跳转，因为没有地方可以跳到。

您不应该需要jQuery来完成这个任务。您的代码应该有<a href="#faq9-1"></a>，而div是<div id="faq9-1">。