javascript - 单击时使用 jquery 简单淡入淡出 div

Question

此处的代码有效，您可以在此处阅读答案 - 我对其进行了编辑以供将来引用。

HTML:

<div><a href="#" id="btn">Show bank div and hide fancy div</a></div>
<div id="btn-bk"><a href="#">back</a></div>
<div id="bank">Bank Div</div>
<div id="fancy">Fancy Div</div>

CSS:

#bank {display:none;}
#btn-bk {display:none;}

Javascript:

    $('#btn').click(function(e){    
    $('#fancy, #btn').fadeOut('slow', function(){
        $('#bank, #btn-bk').fadeIn('slow');
    });
});

    $('#btn-bk').click(function(e){    
        $('#bank, #btn-bk').fadeOut('slow', function(){
            $('#fancy, #btn').fadeIn('slow');
        });
    });

Live DEMO that works

Answer 1

你的问题出在这行代码上:

$('#bank').replace('<div id="fancy"></div>').fadeIn('slow');

jQuery 中没有.replace() 函数。删除它并且它有效:

$('#bank').fadeIn('slow');

在这里查看:http://jsfiddle.net/3XwZv/57/