jquery只显示子项

jquery show only child

本文关键字：显示 jquery      更新时间：2023-09-26

我有一个问题：为了简单起见，我在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();
    });
});​

有人能解决这个问题吗？

试试这个工作小提琴

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

我所做的只是使用$(this).parent()，而不是使用$(".left")选择器。

尝试只查找单击的元素的父元素，并使用其子元素：

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的被点击链接的第一个父级。

将代码更改为：

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

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

相关文章：