JQuery - работа с div - PullRequest
       34

JQuery - работа с div

0 голосов
/ 01 октября 2009

Я хочу установить другой класс для нажатой части меню. Нажатие генерирует URL с #NAME. Вот мое меню:

    <div id="head_menu">
        <a href="#order"><div name="order" id="menu_part">make order</div></a>
        <a href="#portfolio"><div id="menu_part">portfolio</div></a>
        <a href="#contacts"><div id="menu_part">contacts</div></a>
        <a href="#vacancies"><div id="menu_part">vacancies</div></a>
        <a href="#about"><div id="menu_part">about company</div></a>
    </div>

Мне нужно добавить класс: 'menu_choposed' для выбранной части. Вот мой jquery-код:

$(document).ready(
    function()
    {
        currentPage = window.location.hash;
        $('#head_menu>div').each(
            function()
            {
                if( currentPage == $(this).hash )
                {
                    $(this).addClass("menu_choosed");
                }
            }
        )
    }
)

Я действительно не знаю, как фильтровать значения :( Помогите, пожалуйста.

Ответы [ 5 ]

0 голосов
/ 01 октября 2009

Вы можете использовать:

$("#head_menu").find("a[href=" + window.location.hash + "]").addClass('highlight')
0 голосов
/ 01 октября 2009

Простой способ:

$(document).ready(
    function()
    {
        currentPage = window.location.hash;

        $('#head_menu a[href=' + currentPage + '] div').addClass('menu_choosed');
    }
);

Есть несколько проблем с вашим HTML, о которых я хотел бы упомянуть:

  • В настоящее время большинство людей используют списки (<ul>, в основном) для навигации.
  • Наличие <div> внутри <a> недопустимо, если <div> имеет display: block (по умолчанию) и <a> имеет display: inline (по умолчанию).
  • В одном документе может быть только один элемент для каждого идентификатора. В настоящее время у вас есть несколько элементов с идентификатором menu_part.
  • Использование name для опорных точек не рекомендуется. Предпочитаю использовать идентификаторы.
0 голосов
/ 01 октября 2009

Попробуйте это:

$(document).ready(
    function()
    {
        var currentPage = window.location.hash;
        $('#head_menu a div').each(
            function()
            {
                if( currentPage == $(this).parent().attr("href") )
                {
                    $(this).addClass("menu_choosed");
                }
            }
        )
    }
)
0 голосов
/ 01 октября 2009

это должно быть $ ('# head_menu> a> div'), я считаю. Кроме того, идентификаторы должны быть уникальными, поэтому это может вызвать проблемы, если у вас есть несколько div с одним и тем же идентификатором. Вы можете изменить menu_part на класс.

0 голосов
/ 01 октября 2009

Все идентификаторы должны быть уникальными. Вы в настоящее время повторяете menu_part. Я бы предложил удалить дубликаты ID. Дайте навигационным ссылкам класс «nav_link», а затем используйте jquery для ссылки на этот класс с помощью события onclick, которое меняет класс на «menu_choposed».

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...