Self .active пункт меню

Question

У меня есть следующий скрипт:

(function($) {
    $.fn.MenuAutoActive = function() {

        var menus = $('ul li a');
        //menus.removeClass('active');

        var matches = menus.filter(function() {
            return document.location.href.indexOf($(this).attr('href')) >= 0;
        });

        matches.addClass('active');
    };

Что делает идентификатор:

• это перебирает весь список ul> li в поисках 'a'
• отметьте 'a' для 'href'
• если href = текущий URL, к нему добавляется класс 'active'

Единственная проблема, с которой я сталкиваюсь, это выглядит только в последней части href:

например: Главное меню будет:

<ul>
    <li><a href="index.html"></a></li>
    <li><a href="Services/index.html"></a></li>
    <li><a href="Portfolio/index.html"></a></li>
    <li><a href="Conact/index.html"></a></li>
</ul>

URL = http://www.website.com/Services/

В этом случае сценарий НЕ будет помечать <a href="Services/index.html"></a>, так как URL не содержит index.html.

Как сделать так, чтобы последний (после последнего /) и один перед последним битом (до последнего /) URL-адреса?

Любая помощь высоко ценится!

Пит

Answer 1

Это должно работать:

return document.location.href.indexOf(this.href) >= 0;

Обратите внимание, что это обращается к свойству href элемента DOM.Это вернет абсолютный URL.

Так что this.href даст вам http://www.website.com/index.html, а не только index.html.

Answer 2

var bits=$(this).attr('href').split('/');
var thelastbit=bits.pop(); 
var thepenultimatebit=bits.pop(); // previous call removed the last bit

Может быть быстрее, если вы сначала не поместите index.html в ссылку или не удалите ее при опросе

return document.location.href.indexOf($(this).attr('href').replace('index.html','')) >= 0;

Answer 3

попробуйте заменить

document.location.href.indexOf($(this).attr('href')) >0

на

document.location.toString().indexOf($(this).attr('href')) >0