jquery - 选择除特定子项之外的元素

Question

我的问题是:

我选择了一个有很多子元素的 div，我想知道如何不选择某个元素，该元素实际上是先前选择的元素的子元素。

我已经尝试过 :not(selectedElement) 选择器和 .not(selectedElement) 选择器或 api(不知道它是如何调用的)。无论如何，我还发现有人问了一个类似的问题，但没有帮助，所以我想找出问题所在的唯一方法是在这里询问您是否有任何方法(我知道 stackoverflow 并不意味着那样工作，但我认真坐了很多次都解决不了):

HTML:

<div class="tablee" style="cursor:/*pointer*/;">
    <table>
        <tbody>
            <tr>
                <td>
                    <a href="something.php">
                        <img src="1.jpg">
                    </a>
                </td>
                <td class="postcontent">
                    <p class="postusername">
                        <a class="poster" href="something.php">momo</a>
                        <br>
                        some other text
                    </p>
                </td>
                <td>
                    <imgsrc="1.jpg">
                </td>
            </tr>
        </tbody>
    </table>
</div>

jQuery:

//non-dynamyic
$(".tablee").not($(this).find('a')).click(function() {
    $(this).next().slideToggle();
});

因此，如果单击 tablee 而不是其中的链接(在 tablee 元素内)，则 tablee 之后的下一个元素将切换。

Answer 1

首先，您的选择器并未选择所有子项并将点击事件附加到 then。该事件仅在实际选择器上发生，并且在单击子项时该事件向上传播到父项。

您在 .tablee 上有一个点击事件，您不想在点击其中的任何 a 时触发该事件。在这种情况下，使用 stopPropagation 在 a 上有一个单独的事件:-

$(".tablee").click(function() {
    $(this).next().slideToggle();
});

$(".tablee a").click(function(e) {
    e.stopPropagation();
});

然后，这将停止对 a 的任何点击冒泡到 .tablee。