Здравствуйте!
Сайт на Wordpress и используется плагин фильтрации Isotope.js. Я хочу реализовать фильтрацию таким образом, чтобы вместо кнопок "button", были кликабельные ссылки. У меня это уже сделано, но когда я нахожусь на выбранной странице категории, ей не добавляется класс "is-active".
HTML
<div class="filter">
<a href="/" class="filter-item is-active">Все</a>
<a href="test-1" class="filter-item">Категория-1</a>
<a href="test-2" class="filter-item">Категория-2</a>
<a href="test-3" class="filter-item">Категория-3</a>
<a href="test-4" class="filter-item">Категория-4</a>
<a href="test-5" class="filter-item">Категория-5</a>
</div>
JS
// bind filter button click
var filtersElem = document.querySelector('.filter');
if (filtersElem) {
filtersElem.addEventListener('click', function (event) {
if (!matchesSelector(event.target, 'button')) {
return;
}
var filterValue = event.target.getAttribute('data-filter');
filterValue = filterValue;
iso.arrange({
filter: filterValue
});
});
// change is-active class on buttons
var buttonGroups = document.querySelectorAll('.filter');
for (var i = 0, len = buttonGroups.length; i < len; i++) {
var buttonGroup = buttonGroups[i];
radioButtonGroup(buttonGroup);
}
function radioButtonGroup(buttonGroup) {
buttonGroup.addEventListener('click', function (event) {
if (!matchesSelector(event.target, 'button')) {
return;
}
buttonGroup.querySelector('.is-active').classList.remove('is-active');
event.target.classList.add('is-active');
});
}
};
Простой
Средний