Javascript 为什么我的边栏每次点击后都会隐藏？

侧边栏是隐藏的，一旦我提交了正确的pin，它就会消失。但是，当我多次单击侧边栏中的任何选项时，它就隐藏了！为什么?

var pin = 1234; 

$("#confirm_pin").click(function () {
    var pin = document.getElementById("Pin").value;

    if (pin == 1234) {
        alert("You have now acesss!");

        $(".management").hide();
        $(".management_sidebar").fadeIn();

    } else {
        alert("Please, enter the correct pin");
    }
});

    $(".option_management").on("click", function () {

            $(".page_holder_management").children().hide();

            var option = $.trim($(this).text());
            var find_click_object = $(this).attr("id");


            if (option == "Home page") {
                $("div.page_holder_management > div:nth-child(1)").fadeIn();
            } else {
                alert("false");
            }
    });

HTML

站点管理
主页
表格页
测验
测验
更改主页
更改表格页面

在html代码中，当我单击侧边栏中的任何选项时，我创建的页面应该淡出，当我单击另一个选项时，它应该淡出，另一个页面应该淡出

请告诉我哪里做错了

请检查这个来测试我的问题！pin是：1234，您应该简化html和js的关系。我在那里使用了数据属性，如果我理解正确，这就是您想要的

 var pin = 1234; 

$("#confirm_pin").click(function () {
var pin = document.getElementById("Pin").value;

if (pin == 1234) {
    alert("You have now acesss!");

    $(".management").hide();
    $(".management_sidebar").fadeIn();

 } else {
     alert("Please, enter the correct pin");
 }
});

$(".option_management").on("click", function () {
    var target = $(this).data('target');
    $('.contents').hide();
    $('.contents.' + target).fadeIn();        
});

html随数据属性更改

 <div class="option_management" data-target="management_homePage" id="1">Home page</div>
 <div class="option_management" data-target="management_tablePage" id="2">Table page</div>

主页
表格页

您隐藏的

.management

是什么？我刚开始要求输入pin码，但提交了正确的pin码。pin div将隐藏，即.management。为什么您要单击选项上的侧栏？是否还有其他JS？请使用此创建jsbin或JSFIDLE！谢谢我的代码到底出了什么问题？我从来没有编码隐藏侧边栏，为什么它会在两次点击后隐藏？不能说，它没有隐藏在我的测试中。也许还有另一个背景在上面的部门？也许这是一个特定于浏览器的问题？无论如何，你应该避免如果。。。然后使用选定的字符串，它肯定会在某个时候变得混乱。问题解决了！我把它放在绝对位置，所以内容在边栏上！太好了，这就是我所说的另一个div的意思，它的背景在上面….$（'.contents.'+target.fadeIn（）；这是否仅在它是类的情况下才起作用，还是在Id属性下起作用？

 <div class="option_management" data-target="management_homePage" id="1">Home page</div>
 <div class="option_management" data-target="management_tablePage" id="2">Table page</div>