JQuery выбрать функцию выбора

0

Я пытаюсь добиться чего-то внутри функции, чтобы фактически получить доступ к родительскому селектору.

Вот небольшой фрагмент моего HTML-кода:

<div class="module-row module-tab pull-right" id="modtab-sql_net">
    <img src="images/icons/icon-orangebox-plus.png" class="modtab-toggle">
</div>

<div id="tab-module-row-1">
</div>

<div class="module-row module-tab pull-right" id="modtab-sql_dss">
    <img src="images/icons/icon-orangebox-plus.png" class="modtab-toggle">
</div>

<div id="tab-module-row-2">
</div>

Вот сценарий jQuery, который я пробовал:

$('div[id^="modtab-"]').click(function(){
    $(this).next('div[id^="tab-module-row"]').toggle(function(){
        $(this).next('.modtab-toggle').toggle_switch.attr("src").replace("plus", "minus");
// The above line is incorrect. I need to change img attr for the class which is inside the div being clicked
    });
});

Теперь я хочу изменить значок изображения с "плюс" на "минус" (имена файлов хранятся в таком виде).

Мне нужно изменить $(this).next('.modtab-toggle') в коде на что-то, что может работать.

Пожалуйста, НЕ предлагайте просто получить доступ к классу с помощью $('.modtab-toggle') поскольку у меня есть несколько таких тегов div в коде. Так не получится.

Спасибо за любую помощь.

  • 0
    Зачем вам использовать .next("#tab-module-row") когда логически может быть только одна #tab-module-row ?
  • 0
    Извините за то, что я неясно. Я редактировал вопрос. Пожалуйста, проверьте сейчас.
Показать ещё 2 комментария
Теги:

3 ответа

1
Лучший ответ

попробуй что-нибудь вроде этого

    $('div[id^="modtab-"]').click(function(){
        var $this = $(this);// clicked div
        $this.next('.tab-module-row').toggle(function(){
            $this.find('.modtab-toggle').toggle_switch.attr("src").replace("plus", "minus");
        });
    });

Примечание: вы должны использовать class вместо id потому что он должен быть уникальным

#tab-module-row → .tab-module-row

ОТДЕЛЬНЫЙ ОТВЕТ

$('div[id^="modtab-"]').click(function(){
    var $this = $(this);// clicked div
    $this.next('div[id^="tab-module-row"]').toggle(function(){
        var img = $this.find('.modtab-toggle'); // your image object
        // your condition to check which image to display will goes here.
    });
});
Поделиться
  • 0
    Вернет ли это изображение «плюс» при повторном нажатии?
  • 0
    Нет, не думаю. Мне нужно добавить условие, чтобы проверить, скрыт ли элемент или нет. и затем заменить его обратно.
Показать ещё 4 комментария
2

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

$('div[id^="modtab-"]').click(function(){
   $(this).find('.modtab-toggle').attr("src", function(i, attr){
              var o = this.src.indexOf('plus') > -1 ? this.src.replace('plus', 'minus') : this.src.replace('minus', 'plus');
              return o;
          });
});

См. Демонстрацию @Fiddle

Поделиться
  • 0
    Благодарю. Кажется, это работает, но не переключается с минуса на плюс. Любая идея о том, что может пойти не так?
  • 0
    хорошо, подожди..! я обновлю это.
Показать ещё 4 комментария
0

измените $(this).next('.modtab-toggle') на $(this).find('.modtab-toggle') чтобы заставить его работать.

См. Find() docs здесь

Поделиться
  • 0
    find() не будет работать. У меня есть несколько div с одинаковыми изображениями классов. Мне нужно активировать только на этом конкретном изображении.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню