javascript - 如何使用 jQuery 隐藏我的 div，然后通过按不同的 div 再次显示它？

Question

我想做的是:

在页面加载时隐藏我的 div，然后当您单击不同的 div 时它会显示。我有限的知识并不能真正让我做到这一点。我做错了什么？

jQuery:

$(document).ready(function(){
    $('#trojkat2').click(function(){
        $('#login').hide();
    });
});
</script>

“trojkat2”是我要单击以显示“登录”的 div。

HTML:

 <div class="kwadrat2">
    <div class="trojkat2">
    <div class="trojkat_bg2"></div>
    </div>
    </div>

<div class="login">
<img style="height: 550px; width: 280px; border-radius: 10px;" src="buymenu.jpg">
</div>

我做错了什么？

Answer 1

首先，通过.hide() 函数在文档准备好时隐藏#login div，单击$(.trojkat2) 后，使用show() 使#login 出现，顺便类选择器是。而不是#

$(document).ready(function(){
    $('.login').hide();
    $('.trojkat2').click(function(){
        $('.login').show();
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="kwadrat2">
<div class="trojkat2">click here
<div class="trojkat_bg2"></div>
</div>
</div>

<div class="login">
<img style="height: 550px; width: 280px; border-radius: 10px;" src="buymenu.jpg">
</div>