javascript - 如何在单击时隐藏一个 div 并显示另一个？

Question

我有这个查询点击功能:

    <script type="text/javascript">
$(document).ready(function () {

    $('.show_hide').click(function () {
        $(".box").fadeIn(400);
        //$(".box").fadeOut(2500);
    });
});
</script>

<div class="show_hide">Click Here</div>

  <div class="box" style="display:none;">
    <div class="success_message">
        <span class="yes">Yes</span> 
        <span class="no">No</span>
    </div>
</div>

单击“单击此处”后，我想隐藏“单击此处”选项并显示"is"和“否”。但是，当单击这些选项(是或否)中的任何一个时，我想隐藏它们并显示单击此处。我怎样才能做到这一点？

我怎样才能实现这个目标？

Answer 1

演示 --> http://jsfiddle.net/52a4n/1/

$('.show_hide').click(function () {
    $(this).fadeOut();
    $(".box").fadeIn(400);
});

$('.yes,.no').click(function () {
    $(".box").fadeOut(250,function(){
        $('.show_hide').fadeIn();
    });
});