Добавить класс для всех соответствующих ссылок после события click - PullRequest
Новая
       13

Добавить класс для всех соответствующих ссылок после события click

0 голосов
/ 07 ноября 2018

Я пытаюсь добавить класс 'active' ко всем ссылкам, которые имеют ту же ссылку, что и ссылка, которую только что щелкнули.

У меня есть несколько модалов с дублированной навигацией привязки, поэтому MODAL A имеет ссылку на MODAL B, и когда я нажимаю MODAL B, ссылка MODAL B должна иметь класс 'active' во вновь открытой привязке.

Приведенный ниже код не добавляет класс активным, пока я снова не нажму ту же ссылку привязки, потому что я предполагаю, что URL-адрес по-прежнему имеет значение # anchor1, когда я нажимаю # anchor2, поэтому он все еще пытается добавить 'active' к # anchor1 .

Мне нужен способ щелкнуть # anchor2, а затем, после обновления URL-адреса, найти другие ссылки, содержащие # anchor2

.

ИЛИ нажимая на # anchor2, затем ищет любую другую ссылку, содержащую # anchor2 и добавляет класс 'active' 

jQuery('.featured li a').on( "click", function() {      
    jQuery(".featured li a").each(function() {
    if (this.href == window.location.href) {
        jQuery(this).parent().addClass("active");
    } else {
        jQuery(this).parent().removeClass("active");
    }
    });
});

Ответы [ 3 ]

0 голосов
/ 07 ноября 2018

Используйте это 

jQuery('.featured li a').on( "click", function() {
    //here 'this' referencing anchor that is clicked.
    var clicked_anchor = this;
    jQuery(".featured li a").each(function() {
    //here 'this' referencing current iterating anchor 
    if (this.href == clicked_anchor.href) {
        jQuery(this).parent().addClass("active");
    } else {
        jQuery(this).parent().removeClass("active");
    }
    });
});
0 голосов
/ 07 ноября 2018

В рамках функции прослушивания кликов window.location.href еще не обновлено до нового значения. Итак, вам нужно это: 

jQuery('.featured li a').on( "click", function() {
    var currentHref = this.href;     
    jQuery(".featured li a").each(function() {
        if (this.href == currentHref) {
            jQuery(this).parent().addClass("active");
        } else {
            jQuery(this).parent().removeClass("active");
        }
    });
});
0 голосов
/ 07 ноября 2018

Просто переберите все якоря и выключите их, затем используйте href в селекторе, чтобы сопоставить все те же якоря, и включите их. 

jQuery('.featured li a').on('click', function() {
  jQuery('.featured li a').each(function({
    jQuery(this).parent().removeClass("active");
  });
  jQuery('.featured li a[href="'+this.href+'"]').each(function({
    jQuery(this).parent().addClass("active");
  });
})
...