Если URL страницы = привязка в списке, вызвать наведение курсора мыши выделить жирным шрифтом

#javascript #jquery #onload #html-lists

#javascript #jquery #загрузка #html-списки

Вопрос:

Заголовок говорит сам за себя. Чего я пытаюсь добиться, так это проверить URL-адреса загрузки в меню (несколько ul, поскольку у него также есть подменю), и если оно равно, выделите его жирным шрифтом и запустите событие наведения курсора мыши:

 $(document).ready(function(){
    $('#content > ul > li a[href]').filter(function() {return this.href.pathname === window.location.pathname;}).css('font-weight','bold');
    $('#content > ul > li a[href]').filter(function() {return this.href.pathname === window.location.pathname;}).trigger('mouseover');
});

<ul id="menu">
    <li><a href="#" onmouseover="displayID('biography');">Biography</a></li>
    <li><a href="/tagged/Commercial_photography" onmouseover="displayID('commercial-photography');">Commercial photography</a></li>
    <li><a href="/tagged/Fine_art_photography" onmouseover="displayID('fine-art-photography');">Fine art photography</a></li>
    <li><a href="/tagged/Action" onmouseover="displayID('action');">Action</a></li>
    <li><a href="/tagged/Video" onmouseover="displayID('video');">Video</a></li>
    <li><a href="#" onmouseover="displayID('links');">Links</a></li>
</ul>
 

Я предполагаю, что это просто очень простая ошибка, поскольку я не очень знаком с jquery, поэтому я действительно ценю любую помощь

Ответ №1:

href Свойство ссылки — это строка, у которой нет pathname свойства.

Используйте this.pathname , вместо this.href.pathname того, чтобы решить вашу проблему:

 function(){
    return this.pathname === location.pathname amp;amp;
           !/^#/.test(this.getAttribute('href'))   //The href at HTML may not 
}                                                 //start with #
 

Редактировать после комментария:
getAttribute Метод используется для получения исходного href атрибута, поскольку this.href не содержит # , но http://fullpath/etc/file# .

Комментарии:

1. конечно, моя ошибка! Спасибо. Еще один вопрос, который я заметил, он также выделяет ссылки с # go жирным шрифтом, такие как <a href=»#» onmouseover=»DisplayID(‘biography’);»>Биография</a> . Есть ли способ исключить это?

2. Это потрясающе! только для дальнейшего использования, теперь он выбирает ТОЛЬКО ссылки с #, но это можно легко решить путем отрицания 🙂 спасибо, Роб!