Поддержание ссылок с помощью jQuery

Question

Я пытаюсь исправить код существующего сайта. Мы используем хэширование для привязки к идентификатору содержимого. Весь контент скрыт, щелкнув идентификатор, соответствующий маркеру nav в теге привязки, отобразится соответствующее содержимое с идентификатором.

Проблема, с которой я сталкиваюсь, заключается в том, что у одной части навигации есть подраздел, мне нужна одна ссылка для ссылки на PDF, сохраняя содержание страницы родителей. В настоящее время, однако, он будет поддерживать содержание страницы или ссылку на PDF. Любопытно, как все вы могли бы решить эту ситуацию.

You can see the page live

Вот раздел Я говорю:

HTML

<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(); 
    }); 
}); 

NO TE: Я прокомментировал 'preventDefault();' для тестирования, так как это не позволило бы ссылке фактически выпустить в PDF-файл или что-то в этом отношении.

Answer 1

Target только HREF начинает с # использованием attribute starts with selector, также, где нет необходимости в каждом цикле

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