使用jQuery维护链接

Question

我正在试图修复一个现有站点的代码。我们使用散列来关联到内容id的导航。所有内容都是隐藏的，单击与锚标记中的nav哈希匹配的ID，就会用id显示适当的内容。

我遇到的问题是，一个特定的导航部分有一个子部分，我需要一个链接来链接到PDF，同时维护父页面内容。但是目前，它要么维护页面内容，要么链接到PDF。好奇你们如何解决这种情况。

你可以看到页面的实况。

下面是我要说的部分：

<li><a href="#floor-plan">Floor Plans</a>
   <ul class="sub-nav">
     <li><a href="#floor-plan">3D Map</a></li>
     <li><a href="../link/to/pdf">Detailed Floorplan</a></li>
   </ul>
</li> 

JS

$(".main--nav").each(function(){
    $('.main--nav li a').on('click', function(){
     // e.preventDefault();
     var $id = $(this).attr('href');
     $('.exhib-content').hide();
     $($id).show();
    });
});

注意:为了测试，我把'preventDefault();‘注释掉了，因为它不会让链接真正显示到PDF或其他相关内容。

Answer 1

仅以#开头的href为目标，使用属性以选择器开始。，也不需要每个循环

$('.main--nav li a[href^="#"]').on('click', function () {
    e.preventDefault();
    var $id = $(this).attr('href');
    $('.exhib-content').hide();
    $($id).show();
});