[英]Show and hide parent and children divs using jQuery
我有一個包含子html元素的div,當我單擊div時將顯示子元素,在該“隱藏”按鈕中,當我單擊“隱藏父對象”時也會隱藏。 please help me
使用display: none
您要隱藏的div上的CSS中display: none
。 如果要顯示它們,請使用$("#yourdiv").css("display","block");
在你的jQuery中。
最好是可以發布相關代碼,無論如何,這里都是為您制作的示例:
的HTML
<div class="parent">Hey All
<div>a</div>
<div>b</div>
<div>c
<button class="hide" data-type="parent">Hide Parent</button>
<button class="hide" data-type="children">Hide Children</button>
</div>
</div>
<div class="parent">Hey All 1
<div>a</div>
<div>b</div>
<div>c
<button class="hide" data-type="parent">Hide Parent</button>
<button class="hide" data-type="children">Hide Children</button>
</div>
JS
$('.parent').click(function () {
// show direct child when parent div was clicked
$(this).children().css('display', 'block');
});
// hide parent or child
$('.hide').click(function (e) {
e.stopPropagation();
var type = $(this).data('type');
var parent = $(this).closest('.parent');
if (type === "parent") parent.css('display', 'none');
else parent.children().css('display', 'none');
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.