Цитата:
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> .current-menu-item a{ color: red; } </style> </head> <body> <ul class="news-nav-list"> <li><a href="?y=2022&еще всякие запросы">2022</a></li> <li><a href="?y=2021&еще всякие запросы">2021</a></li> <li><a href="?y=2018&еще всякие запросы">2018</a></li> и т.д. </ul> <ul class="news-nav-list"> <li><a href="?всякие запросы&m=04">Апрель</a></li> <li><a href="?всякие запросы&m=09">Сентябрь</a></li> и т.д. </ul> <ul class="news-nav-list"> <li><a href="?всякие запросы&m=04">Апрель</a></li> <li><a href="?всякие запросы&m=09&y=2018">тест</a></li> и т.д. </ul> <script> const params = new URLSearchParams("?y=2018"); //const params = new URLSearchParams(location.search); document.querySelectorAll(".news-nav-list li").forEach(li => { let link = li.querySelector("a"); let href = link.href; let url = new URL(href); let search = new URLSearchParams(url.search); li.classList.remove("current-menu-item"); let add; if(params.has("y") && params.has("m")) add = ["y","m"].every(key => search.has(key) && params.get(key) == search.get(key)); else if(params.has("m")) add = !search.has("y") && params.get("m") == search.get("m"); else if(params.has("y")) add = (!search.has("m") && params.get("y") == search.get("y")) || (search.has("m") && !search.has("y")); if(add) li.classList.add("current-menu-item"); }) </script> </body> </html> |
Вы наверное меня не правильно поняли...
Если не активна ни одна ссылка то их перечень выглядит так <ul class="news-nav-list"> Год: <li><a href="?y=2022&m=05">2022</a></li> <li><a href="?y=2021&m=05">2021</a></li> <li><a href="?y=2018&m=05">2018</a></li> </ul> и соответственно <ul class="news-nav-list"> Месяц: <li><a href="?y=2022&m=04">Апрель</a></li> <li><a href="?y=2022&m=09">Сентябрь</a></li> </ul> т.е. в параметры добавляется текущий год и месяц соответственно: Чтобы выбрав только год, можно было посмотреть статьи за текущий месяц нужного года, а если не выбирая год нажать на месяц то будут показаны статьи за текущий год выбранного месяца. НО... Если мы выбрали например 2018 год, то список ссылок уже на обновленной странице, будет выглядеть подругому - Вот так: <ul class="news-nav-list"> Год: <li><a href="?y=2022&m=05">2022</a></li> <li><a href="?y=2021&m=05">2021</a></li> <li><a href="?y=2018&m=05">2018</a></li> </ul> и соответственно <ul class="news-nav-list"> Месяц: <li class="current-menu-item"><a href="?y=2018&m=04">Апрель</a></li> <li class="current-menu-item"><a href="?y=2018&m=09">Сентябрь</a></li> </ul> А если мы выбрали еще и месяц - например Сентябрь - то список ссылок уже будет таким: <ul class="news-nav-list"> Год: <li class="current-menu-item"><a href="?y=2022&m=09">2022</a></li> <li class="current-menu-item"><a href="?y=2021&m=09">2021</a></li> <li class="current-menu-item"><a href="?y=2018&m=09">2018</a></li> </ul> и соответственно <ul class="news-nav-list"> Месяц: <li class="current-menu-item"><a href="?y=2018&m=04">Апрель</a></li> <li class="current-menu-item"><a href="?y=2018&m=09">Сентябрь</a></li> </ul> т.е. у меня в ссылке - в строке браузера - всегда есть параметр года и параметр месяца (если нажата хоть одна из них) - и всегда в порядке - ?y=ГОД&m=МЕСЯЦ |
firsmember,
я пас))) вам виднее ваши ссылки и что вы хотите выделить, я могу только гадать. |
ВОТ БЛИН! ЭТО Я ЗАТУПОК! Я НЕ Убрал, предыдущий скрипт!!!!
Рони - Вы Гений - не первый раз меня выручаете! Большое вам спасибо! Счастья вам и вашим близким! |
Цитата:
видимо вы не смогли лаконично объяснить задачу, если из предложенных вариантов, вам ничего не подходит. |
firsmember,
ура!!!:) |
Часовой пояс GMT +3, время: 12:24. |