jquery - 我在换页时遇到了很多麻烦

Question

function pageSwap(page) {
 $(".content").fadeOut("1000",function(){
  $(".content").load(page, function (){
   $(".content").fadeIn("5000");    
  });
 });
}

这从 pageswap.js 包含在我的页面中，然后

<script type="text/javascript">
 $(document).ready(function (){
   $(".content").pageSwap("main.html");
 });
</script>

我确实有 main.html，包含脚本，调用了函数，但它不起作用..

Answer 1

您已经声明了一个全局函数，但没有使用该函数扩展 jQuery。所以你只需要pageSwap()像下面这样调用：

<script type="text/javascript">
    $(document).ready(function() {
        pageSwap("main.html");
    });
</script>

---

更新pageSwap：您可以使用以下代码使用方法扩展 JQuery ：

(function($) {
    $.fn.extend({
        pageSwap: function(page) {
            return this.each(function() {
                var obj = $(this);
                obj.fadeOut("1000", function() {
                    obj.load(page, function() {
                        obj.fadeIn("5000");
                    });
                });
            });
        }
    });
})(jQuery);

但是，@Esailija 的回答中描述了另一种替代方法。

Answer 2

您需要这样做才能使您的代码正常工作：

$.fn.pageSwap = function(page) {
    this.fadeOut("1000", $.proxy( function(){
        this.load(page, $.proxy( function (){
            this.fadeIn("5000");    
        }, this ));
    }, this ));
};