我还有另一个jQuery嵌套div问题,显示和隐藏嵌套div。
这次,我可以隐藏最初的父div,但是我很难弄清楚如何再次将其恢复到链中?
这就是我所拥有的:
的HTML
<div class="item">
<div class="link">
<a class="thing" href="#">Click Here</a>
</div>
<div class="undo">
<a class="go-back" href="#">undo that?</a>
</div>
</div>
<div class="item">
<div class="link">
<a class="thing" href="#">Click Here</a>
</div>
<div class="undo">
<a class="go-back" href="#">undo that?</a>
</div>
</div>
JS
$('.undo').hide();
$('.thing').on('click', function() {
$(this).closest(".link").hide();
$(this).parents().next(".undo").show();
return false;
});
$('.go-back').on('click', function() {
$(this).closest(".undo").hide();
$(this).parents().next(".link").show();
return false;
});
我总是对如何获取它以正确的继承为目标感到困惑,无论它是父母,孩子,父母,兄弟姐妹等。
最佳答案
这里的问题是,当您想撤消搜索next()
元素,但是现在按标记顺序搜索prev()
元素时,请检查以下代码段:
$('.undo').hide();
$('.thing').on('click', function() {
$(this).closest(".link").hide();
$(this).parents().next(".undo").show();
return false;
});
$('.go-back').on('click', function() {
$(this).closest(".undo").hide();
$(this).parents().prev(".link").show();
return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="item">
<div class="link">
<a class="thing" href="#">Click Here</a>
</div>
<div class="undo">
<a class="go-back" href="#">undo that?</a>
</div>
</div>
<div class="item">
<div class="link">
<a class="thing" href="#">Click Here</a>
</div>
<div class="undo">
<a class="go-back" href="#">undo that?</a>
</div>
</div>
奖金
您可以将其恢复为仅一次单击事件,如下所示:
$('.undo').hide();
$('.item').on('click','a', function() {
$(this).parent().hide().siblings().show();
return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="item">
<div class="link">
<a class="thing" href="#">Click Here</a>
</div>
<div class="undo">
<a class="go-back" href="#">undo that?</a>
</div>
</div>
<div class="item">
<div class="link">
<a class="thing" href="#">Click Here</a>
</div>
<div class="undo">
<a class="go-back" href="#">undo that?</a>
</div>
</div>
关于javascript - 显示/隐藏div并撤消每个div的隐藏jQuery,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42772174/