jquery - jQuery在隐藏代码后重新显示一个div

Question

这是对已修复的预览代码问题的更新。我现在正在做的是添加第二个可链接li以隐藏mykadd div 并重新显示 mykink。

这是我正在尝试做的一个示例...... http://jsfiddle.net/eWtaz/1/它有点工作，但它的错误

<li id="myklnk2">Show Main System</li>
<li id="myklnk1">Un/Select system</li>

<script type="text/javascript">
$(document).ready(function(){
    $(".mykadd").hide();    
    $("#myklnk2").on("click", function(){
        $(".mykink, .mykadd").slideToggle();

    $("#myklnk1").on("click", function(){
        $(".mykadd, .mykink").slideToggle();
    });
    });
});
</script>

Answer 1

只需固定您的关闭位置 });

jsFiddle

$("#myklnk2").on("click", function(){
    $(".mykink, .mykadd").slideToggle();
});   // put it here

$("#myklnk1").on("click", function(){
    $(".mykadd, .mykink").slideToggle();   
});
// not here

Answer 2

你就不能这样做吗？

<li id="myklnk2">Show Main System</li>
<li id="myklnk1">Un/Select system</li>

<script type="text/javascript">
$(document).ready(function(){
    $(".mykadd").hide();    
    $("#myklnk2").on("click", function(){
        $(".mykink").slideUp();
        $(".mykadd").slideDown();
    });
    $("#myklnk1").on("click", function(){
        $(".mykadd").slideUp();
        $(".mykink").slideDown();
    });
});
</script>

同样按照您现在的方式，$("#myklnk1") 单击事件嵌套在 $("#myklnk2") 单击事件中。

Answer 3

})是在错误的位置。
您可以做的其他事情是选择两者li来绑定事件并display: none改为使用。

html

$(document).ready(function(){   
    $("#myklnk2, #myklnk1").on("click", function(){
        $(".mykink, .mykadd").slideToggle();
    });
});​

css

.mykadd {
    display: none;
}

演示

Answer 4

不要在第一次点击处理程序中附加第二次点击事件，因为这发生在事件传播之前，这会触发您的第二次点击。