关于隐藏选定的div的div

Question

我都觉得五周的div布局如下面的代码jQuery的帮助..

//Div one 
<div class="container"> 
<div class="hide"> 
    <button class="hide" value="hide" /> 
</div> 
</div> 

//Div Two 
<div class="container"> 
<div class="hide"> 
    <button class="hide" value="hide" /> 
</div> 
</div> 

//Div Three 
< div class="container"> 
<div class="hide"> 
    <button class="hide" value="hide" /> 
</div> 
</div> 

说现在我点击第二个div的隐藏按钮，我想隐藏第二div ..这是我想隐藏的按钮点击对应的div .. 如何通过jquery做到这一点???

我尝试使用jQuery的通过了“这个”关键字，但这样会隐藏所有的容器，而不是只有一个。 请帮我

Answer 1

$('button.hide').on('click', function() { 
    $(this).closest('.container').hide() 
}); 

我指定button.hide代替.hide的选择，因为你必须与类名多种不同元素

查看jQuery docs

closest()使用获取第一个匹配的元素选择器，从当前元素开始，在DOM树中前进。

Answer 2

使用jQuery .closest()方法遍历DOM树以定位<div>。然后你可以触发div上的隐藏。

$('button.hide').click(function() { 
    $(this).closest('.container').hide(); 
}); 

这，当然，是在DOM准备好做：$(document).ready(function() { /*...*/ });