Question

我有以下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');
});

我一直在和兄弟姐妹，下一个和其他事情一起尝试几个小时，但没有任何作用。我真的不明白为什么！我能做些什么让这个有用的想法？

Answer 1

该树中没有下一个DIV。你需要先上树。

尝试：$(this).parent().next('div').slideToggle('slow');

Answer 2

您在a内选择了span 。 .next()只会在链接后找到img标记并对其进行处理。

尝试此操作，使用parent()选择span和然后在其后找到div：

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

Answer 3

如果仔细查看HTML，您会发现链接或图片后面没有<div>。它是父容器的兄弟.open_download_link。

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

Answer 4

您尝试选择的div不是可点击元素的兄弟。试试这个：

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

Answer 5

尝试 -

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

这将向上移动到单击的元素parent（'open_download_link'span）next然后可用于查找span元素的兄弟div。

演示 - http://jsfiddle.net/CP99R/

jQuery中的.next不起作用

5 个答案: