jquery只顯示孩子

Question

我有一個問題：爲了簡單起見，我在div上使用類，我想在點擊後顯示一個隱藏的div，但只在該div上，問題是它顯示在所有div上，而我似乎無法得到它的工作，這裏是與問題的jsfiddle：http://jsfiddle.net/cWNvT/

HTML：

<div class="left"> 
    <a href="#" class="edit-click">Edit</a> 
    <div class="edit"> 
     <p>edit here</p> 
    </div> 
</div> 
<div class="left"> 
    <a href="#" class="edit-click">Edit</a> 
    <div class="edit"> 
     <p>edit here</p> 
    </div> 
</div> 
<div class="left"> 
    <a href="#" class="edit-click">Edit</a> 
    <div class="edit"> 
     <p>edit here</p> 
    </div> 
</div> 

的JavaScript：

$(document).ready(function() { 
    $('.edit').hide(); 
    $('.left a.edit-click').click(function() { 
     $('.left').children().show(); 
    }); 
});​ 

任何人有一個解決方案？

Answer 1

試試這個工作fiddle。

$(document).ready(function() { 
$('.edit').hide(); 
$('.left a.edit-click').click(function(){ 
    $(this).parent().children().show(); 
}); 
}); 

我所做的是使用$(this).parent()而不是用$(".left")選擇的。

Answer 2

嘗試發現只有點擊的元素的父，並使用其孩子：

http://jsfiddle.net/cWNvT/1/

$(document).ready(function() { 
    $('.edit').hide(); 
    $('.left a.edit-click').click(function(){ 
     $(this).closest(".left").children().show(); 
    }); 
}); 
​ 

$(".left")選擇文檔中與.left類的所有元素。 $(this).closest(".left")找到類別爲.left的點擊鏈接的第一個父級。

Answer 3

你的代碼改成這樣：

$('.left a.edit-click').click(function(){ 
    $(this).next('.edit').show(); 
}); 

http://jsfiddle.net/cWNvT/3/