Question

    <a href="#"> Link1  </a>  
    <div id="parent">
         <div id="child1">
                    Here is the Child One
         </div>
         <div id="child2">
                    Here is the Child Two
         </div>
    </div>

如何使用jquery隐藏child1 div？

更新

我想在点击Link1

时隐藏child1

Answer 1

为什么要使用jQuery？

CSS

 #child1{
   display: none;
 }

或者如果你真的想使用jQuery

$("#child1").hide();

如果要隐藏点击：因为您在标记中使用ID，所以这很简单

$("#parent").click(function() {
   $("#child1").hide();
});

Answer 2

$('div#parent > div#child1').hide();

以上隐藏#parent的直接孩子。

点击

$('YOURLINK').on('click',function()
{
    $('div#parent > div#child1').hide();
});

Answer 3

尝试

$("#child1").hide();

或者您可以尝试

$("#child1").css('display','none');

根据您编辑的问题，它应该是

$("#link1").click(function(e){
     e.preventDefault();
     $("#child1").hide();
});

并在http://jquery.com/

中查看jquery功能

并查看http://api.jquery.com/selector/

中的jquery选择器

Answer 4

$(document).ready(function(){
     $("#link1").on('click',function(){
         $("#child1").hide();
     });
});

与child2相同。

Answer 5

如果你想在div中隐藏第一个内在孩子： -

$('#link1ID').click(function(){        
    $('div#parent div:first').hide();    
});

如果您想隐藏使用子ID： -

 $('#link1ID').click(function(){            
        $('div#parent div#child1').hide();        
 });

Answer 6

这将隐藏child1 onclick link1和child2 onclick link2

<强> DEMO

$('a').click(function(e){
    e.preventDefault()
    $(this).closest('div').hide();
});

如果你想隐藏child1 onclick父div下的任何链接

$('a').click(function(e){
    e.preventDefault()
    $(this).parentsUntil('parent').find('#child1').hide();
});

<强> HTML

<div id="parent">
     <div id="child1">
         <a href="#">link1</a>
     </div>
     <div id="child2">
         <a href="#">link2</a>
     </div>
</div>

Answer 7

只需选择并隐藏孩子，如下所示：

$("#parent").children().hide();

然后，随时选择并显示/隐藏任何孩子。

使用jQuery隐藏内部Div

7 个答案: