Jquery 淡出一篇文章，同时放下一张表格？

我有一篇文章：

<article>
    Some paragraphs.
</article>

联系人

设置为

显示：无

我使用jQuery来切换它。我试图做的是从
http://tutsplus.com/lesson/slides-and-structure/
使文章文本淡出，然后在联系人表单中滑动。有点麻烦

代码：

当我执行
.on（'click'，this.show'）它可以正常工作，当我把
这个放在一个函数中时，显示它不工作
 
this.show（）
在
close（）
中工作正常，因为
此
在
close（）
的范围内，但在
的范围内不可用。（'click'）回调函数
，所以您需要像下面一样保留
此
的引用并重用它

 close: function() {
        // keeping reference
        var reference = this;

        $('<span class=close>X</span>')
            .prependTo(this)
            .on('click', function(){
                //  using above reference here
                reference.article.fadeToggle(300);
                reference.container.slideToggle(300);
            })
    }

close:function（）{
//保持参考
var reference=此；
$（'X'）
.prependTo（本）
.on（'单击'，函数（））{
//在这里使用上述参考
参考文献：fadeToggle第条（300）；
参考.容器.滑动开关（300）；
})
}
在
init
方法的“我的”按钮中，当我单击它时，我希望文章随着按钮和联系人表单淡入淡出。当我单击联系人表单顶部的
X
时，联系人表单淡出，文章以及按钮淡入。谢谢你的例子，它确实帮我清理了范围。@eveo很乐意帮忙，如果有任何答案，你应该接受
<script>

(function() {

$('html').addClass('js');

var contactForm = {

    container: $('#contact'),
    article: $('article'),

    init: function() {
        $('<button></button>', {
            text: 'Contact Me'
        })
            .insertAfter('article:first')
            .on('click', function() {
                console.log(this);
                this.show();
                // contactForm.article.fadeToggle(300);
                // contactForm.container.show();
            })
    },

    show: function() {
        contactForm.close.call(contactForm.container);
        contactForm.container.slideToggle(300);
    },

    close: function() {
        console.log(this);
        $('<span class=close>X</span>')
            .prependTo(this)
            .on('click', function(){
                contactForm.article.fadeToggle(300);
                contactForm.container.slideToggle(300);
            })
    }
};

contactForm.init();

})();

</script>

.on('click', function() {
    console.log(this);
    this.show();
    // contactForm.article.fadeToggle(300);
    // contactForm.container.show();
})

 close: function() {
        // keeping reference
        var reference = this;

        $('<span class=close>X</span>')
            .prependTo(this)
            .on('click', function(){
                //  using above reference here
                reference.article.fadeToggle(300);
                reference.container.slideToggle(300);
            })
    }