JQuery: добавить функцию щелчка к изображениям, чтобы открыть / закрыть меню - PullRequest
0 голосов
/ 04 декабря 2011

Я создаю меню на основе Javascript и немного застрял с моим кодом jQuery, который выглядит следующим образом:

// Add <img> tags
$(".menu-block-wrapper").find('li').not('.leaf').prepend('<img src="plus-sign.png"/>');

// Add clicking functionality to images
$(".menu-block-wrapper").find('li').not('.leaf > img').click(
     function(event) {
       $('ul', this).first().toggle();

       var ul = $('ul', this).first();

       if (ul.is(":hidden")) {
        $('img', this).first().attr( "src", "plus-sign.png" );
       } else {
        $('img', this).first().attr( "src", "minus-sign.png" );
       }

       event.stopPropagation();
    });

Запуск этого кода на моей тестовой странице ( jQuery Test Page ), я получаю удовлетворительные результаты. (Обратите внимание, что другие функции, такие как придание элементам расширенного меню правильного значка, обрабатываются другим кодом, поэтому не беспокойтесь об этом.)

Однако функция щелчка применяетсяна весь тег <li>.Я хочу, чтобы функция щелчка применялась только к тегу <img>.Отсутствие у меня знаний о jQuery, похоже, ограничивает меня, поскольку все, что я пробовал, нарушало функциональность щелчка.

Может быть удобно использовать мою тестовую страницу jQuery для подтверждения предложенных вами изменений,Спасибо за ваше время.

1 Ответ

1 голос
/ 04 декабря 2011

Я думаю, что вы хотите:

$(".menu-block-wrapper").find('li img').not('.leaf > img').click( ...

Это определит функцию щелчка на изображениях, вложенных в элементы списка, которые не являются непосредственными детьми элемента с именем класса "leaf"

...