У меня есть JQuery, который выбирает одну из ссылок навигации - на странице, на которой я включен, - и затем переводит ее в начало списка. Это прекрасно работает. Проблема в том, что я хочу сделать оператор if, который будет проверять, находится ли пользователь на странице, не находящейся в навигационных ссылках. Если утверждение if истинно, оно добавит 404 навигационную ссылку в список (но эта часть preend работает нормально и, следовательно, является непочтительной).
Это HTML моей навигационной панели:
<nav>
<ul id='nav'>
<li><a href="index.php">Home</a></li>
<li><a href="skillsets.php">Skillsets</a></li>
<li><a href="gallery.php">Gallery</a></li>
<li><a href="about.php">About</a></li>
<li><a href="contact.php">Contact</a></li>
</ul>
</nav>
Это JQuery, который я использую:
var page = document.location.pathname.match(/[^\/]+$/)[0];
$(document).ready(function(){
var ul = $('nav > ul'),
li = ul.children('li'),
href = li.find('a[href*="'+page+'"]');
//move element to top
ul.prepend(href.parent());
if(page != li.children('a').attr('href') && page != ""){
ul.prepend("<li><a href='404NotFound.php'>404</a></li>");
}
});
Как вы можете видеть, оператор if должен проверять, не ли ли моя переменная страницы не равна значениям ссылок, содержащимся в элементах списка, и что переменная страницы не является пустой. Проблема заключается в том, что li.children('a').attr('href')
возвращает только первую навигационную ссылку: index.php и ни один из остальных. Поэтому, если я на другой странице, кроме моей домашней страницы, оператор if возвращается как истинный.
Я очень открыт для предложений, например, если оператор if не лучший способ делать то, что я пытаюсь сделать, то есть, если есть какой-то способ проверить, является ли ul.prepend(href.parent());
фактически выполнен. Благодарю!
Обновить:
Я объясню, что я прошу здесь немного лучше. У меня есть сервер на ndi.grn.cc/(не могу точно это продемонстрировать на JSFiddle). Когда кто-то переходит к ndi.grn.cc/, ndi.grn.cc/index.php, ndi.grn.cc/skillsets.php, ndi.grn.cc/gallery.php, ndi.grn.cc/about.php, или ndi.grn.cc/contact.php Я не хочу, чтобы оператор if возвращал true (а затем не создавал и добавлял ссылку 404), хотя я хочу, чтобы соответствующие навигационные ссылки были добавлены (они поэтому не беспокойтесь об этом). Я хочу добавить ссылку 404, когда кто-то перейдет на ndi.grn.cc/asdkjgkj или просто что-то опечатает и перейдет на ndi.grn.cc/skilsets.php. Поэтому я хочу, чтобы li.children('a').attr('href')
чтобы получить не просто: index.php, но также skillsets.php, gallery.php, about.php и contact.php
Если вы перейдете на мой сайт, вы увидите, что это добавление ссылки 404 работает, но слишком часто. Единственный раз, когда ссылка 404 не будет добавлена, - это когда вы находитесь на ndi.grn.cc/или ndi.grn.cc/index.php. Вы также заметите, что эти функции делают мой навигационный бар непонятным и уродливым. Это связано с тем, что у меня установлен этот код, поэтому он будет выполняться только на моем мобильном веб-сайте, который будет иметь навигационную панель аккордеона. Для упрощения (так что вам, ребята, не нужно тестировать этот сайт на iDevices или Androids), я сделал это, чтобы этот код также выполнялся на моем обычном сайте. Вы также можете заметить, что страницы skillsest.php и gallery.php еще не существуют. Этот сайт - очень большая работа в процессе; У меня есть много, чтобы добавить и улучшить.
Кстати, страница var вернется "", если вы на ndi.grn.cc/, "contact.php", если вы на ndi.grn.cc/contact.php или даже если вы на ndi. grn.cc/contact.php?mail=sent. Надеюсь, вы получите эту идею.
Проблема в том, как вы вызываете attr
. attr
будет соответствовать только совпадающему элементу.
Получите значение атрибута для первого элемента в наборе согласованных элементов или установите один или несколько атрибутов для каждого согласованного элемента.
Это означает, что вы захотите обновить свой код, чтобы выглядеть примерно так:
li.children('a').each(function(){ /* do something with $(this).attr() */ })
Удачи!
Изменение: здесь скрипка, демонстрирующая each
(где я меняю ссылку на "gif" на google.com)
$(document).ready(function(){
: li.children('a').each(function(){ var nav_links = $(this).attr('href'); })
и это сломало мой код.