Question

所以，就像这样的

<div>
    <button>Click me</button>
    <img src=#>
</div>

<div>
    <button>Click me</button>
    <img src=#>
</div>

<div>
    <button>Click me</button>
    <img src=#>
</div>

和脚本

$("button").click(function() {img.hide() });

如何让js只在包含点击按钮的div中执行？生成dom，所以我们不能使用特定的类或id的

Answer 1

您可以使用parent()和find()方法。

$("button").click(function () {
    $(this).parent().find('img').hide()
});

或next()方法如下。

$("button").click(function () {
    $(this).next('img').hide()
});

Answer 2

尝试在此背景下使用.next()，

$("button").click(function () {
    $(this).next('img').hide()
});

由于我们需要定位的图像是点击按钮的下一个直接兄弟。

Answer 3

$("button").click(function() {
    $(this).siblings('img').hide(); 
});

这仅取决于当前节点的结构，如果图像在按钮之前或之后无关紧要。您可以详细了解siblings() here和live code example here

Answer 4

I think you are looking for this..
$("button").click(function() {
    $(this).next('img').hide();
});

Answer 5

我认为这就是你想要的，请看小提琴：https://jsfiddle.net/DIRTY_SMITH/7oe5kh9L/26/

HTML

<div>
 <button>Click me</button>
 <img src=#>
</div>

<div>
 <button>Click me</button>
 <img src=#>
</div>

<div>
 <button>Click me</button>
 <img src=#>
</div>

JQuery的

$("button").click(function() {
    $(this).siblings('img').hide();
});

如何在特定div中执行脚本

5 个答案: