.next в jQuery не работает

#jquery

#jquery

Вопрос:

У меня есть следующий HTML:

 <span class="open_download_link">
    <a>Downloads</a>
    <img src="layout/download.gif"/>
</span>
<div class="download_box">
    <img src="layout/icon_en.png" />
    <a target="_blank" href="products/pdf/modules_bp_3230Q_en.pdf">Datasheet download</a>
    <img src="layout/pdf.gif" />
    <a target="_blank" href="products/pdf/modules_bp_3230Q_en.pdf">pdf, 1.6 MB</a>
</div>
  

с помощью этого jQuery:

 $('.open_download_link a, .open_download_link img').click(
    function () {
        $(this).next('div').slideToggle('slow');
});
  

Я часами пытался использовать sibling, nextAll и другие вещи, но ничего не работает.
Я действительно не понимаю, почему!
Любые идеи о том, что я мог бы сделать, чтобы это сработало?

Ответ №1:

Вы выбираете a внутри span . .next() просто найдет img тег после ссылки и сделает что-то с этим.

Попробуйте это, используя parent() для выбора span , а затем найдите div после него:

 $('.open_download_link a, .open_download_link img').click(function () {
        $(this).parent().next('div').slideToggle('slow');
});
  

Ответ №2:

В этом дереве нет следующего DIV. Сначала вам нужно подняться по дереву.

Попробуйте: $(this).parent().next('div').slideToggle('slow');

Ответ №3:

Если вы внимательно посмотрите на свой HTML, вы увидите, что <div> по ссылке или изображению нет перехода. Это родной брат родительского контейнера, .open_download_link .

 $('.open_download_link a, .open_download_link img').click(function () {
        $(this).parent().next('div').slideToggle('slow');
});
  

Ответ №4:

Div, который вы пытаетесь выбрать, не является родным братом кликабельных элементов. Попробуйте это:

 $('.open_download_link a, .open_download_link img').click(
    function () {
        $(this).closest('.open_download_link').next('div').slideToggle('slow');
    }
});
  

Ответ №5:

Попробуйте —

 $('.open_download_link a, .open_download_link img').click(
    function () {
        $(this).parent().next('div').slideToggle('slow');
});
  

Это приведет к переходу к родительским элементам, на которые нажимается элемент (диапазон ‘open_download_link’) next , который затем можно использовать для поиска дочернего элемента div элемента span.

Демонстрация — http://jsfiddle.net/CP99R /