导航项目链接未正确链接到新页面答案

【问题标题】：Nav item links not properly linking to new page导航项目链接未正确链接到新页面
【发布时间】：2021-03-28 05:49:59
【问题描述】：

我正在使用 Django 来执行此操作，

我有一个带有标签的导航列表，我希望每个标签都转到一个新页面和新的相应视图，新页面都将具有相同的导航列表，只是具有不同的活动标签。

由于某种原因，当我单击选项卡时，它不会改变页面，我不确定我做错了什么。

这是我在带有标签的主页中的代码：

<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" data-toggle="tab" href="#summary">Summary</a>
  </li>
  <li class="nav-item">
    <a class="nav-link external" data-toggle="tab" href="{% url 'financials:description' ticker %}">Description</a>
  </li>
</ul>

我知道该链接是正确的，因为我已经在导航链接之外对其进行了测试，并且它工作正常。当我将鼠标悬停在选项卡上时，我会在页面底部看到正确的 URL，但是当我单击时没有任何反应。我不确定这是否与 javascript 有关（我还不了解 javascript 并在线获取了网站模板）。以下是一些可能导致问题的 javascript：

, $(".one-page-scroll .nav-item a").on("click", function (o) {
        var t = $(this);
        $('.nav-item').removeClass('active');
        $(t).parent().addClass('active');
        $('body').removeClass('openmenu');
        $("html, body").stop().animate({
            scrollTop: $(t.attr("href")).offset().top - 50
        }, 1500, "easeInOutExpo"), o.preventDefault()
    }), $(document).on("click", ".navbar-collapse.show", function (o) {
        $(o.target).is("a") && $(this).collapse("hide")
    }), $(window).on("scroll", function () {
        $(this).scrollTop() > 100 ? $(".back_top").fadeIn() : $(".back_top").fadeOut()
    }), $(".back_top").on("click", function () {
        return $("html, body").animate({
            scrollTop: 0
        }, 1e3), !1

谢谢，非常感谢任何帮助！

【问题讨论】：

从这里很难说。我们可以看看你的 urls.py 和 views.py 文件吗？
如果有空间我会尝试添加它们，但我不认为问题出在它们身上，因为我在 li 标记之外尝试了相同的
尝试在单击链接时保持控制台打开。它可能会给你一些有用的错误信息
我最终通过取出：data-toggle="tab" 让它工作。不完全确定这是做什么的，但希望它不会破坏其他任何东西！

标签： javascript html django

【解决方案1】：

<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" data-toggle="tab" href="summary">Summary</a>
  </li>
  <li class="nav-item">
    <a class="nav-link external" data-toggle="tab" href="{url 'financials:description' ticker }">Description</a>
  </li>
</ul>

【讨论】：