破碎的导航链接？

Question

出于某种原因，this website-in-process上的代码不允许我点击导航栏中的链接。 Home，FAQ和About链接都应该是实时的，但一切都没有发生。这是我目前编码和预览的所有三个页面的情况。 （如果您查看代码，会列出联系人链接，但它不会链接到任何内容;这是暂时的，现在是有目的的。）

当您尝试单击这些链接时会出现问题。什么都没发生，并且没有打开新页面。但是，如果右键单击它们，并选择“在新选项卡中打开链接”，它们就可以正常工作。我无法弄清楚什么是破碎的，感觉应该是一个简单的解决方法。

有什么建议吗？

- 编辑 -

问题中的导航代码：

<nav id="fixedbar">
    <div class="nav-content">
        <ul class="navmain navfixed">
            <a href="http://www.kadehall.com/preview/awards/"><li class="navspot">home</li></a>
            <a href="#"><li class="navspot">store</li></a>
            <a href="#"><li class="navspot">gallery</li></a>
            <a href="http://www.kadehall.com/preview/awards/faq/"><li class="navspot stay" id="end-leftnav">FAQ</li></a>
            <li><a href="#top"><img src="parts/header/column-circle.png" id="columncircle"/></a></li>
            <a href="http://www.kadehall.com/preview/awards/about/"><li class="navspot" id="start-rightnav">about</li></a>
            <a href="http://www.kadehall.com/preview/awards/contact/"><li class="navspot">contact</li></a>
            <!-- start social -->
            <li class="navsoc">
                <a href="#"><img src="parts/social/facebook.png" /></a>
                <a href="#"><img src="parts/social/etsy.png" /></a>
                <a href="#"><img src="parts/social/pinterest.png" /></a>
            </li>
        </ul>
    </div>
</nav>
<!-- There is also an alternate nav for when the page is not scrolling,
     but the only difference is the use of id="fixedbar" -->

Answer 1

您需要将 标记放在 li 中，这是您当前的代码

应该是：

<li><a href="">About</a></li>

等

Answer 2

<ul>标记只能包含<li>个孩子。由于您的<a>位于<li>之外，因此<a>标记已被推出<ul>。

在<a>

中插入这些<li>代码

Answer 3

您的HTML结构不正确。

<ul class="navmain">
  <a href="/awards">
    <li class="navspot">home</li>
  </a>
</ul>

应该是

<ul class="navmain">
  <li class="navspot">
    <a href="/awards">home</a>
  </li>
</ul>

您不能在li或ul列表中嵌套除ol元素之外的任何内容。

Answer 4

这是一个JavaScript问题。

请在第269行查看常见问题解答页面的html源代码：

$('#navigation a, #fixedbar a').on('click', function(e) {
e.preventDefault();
});

单击链接时，preventDefault()功能会取消默认事件。