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>

UPDATE ：您可以使用以下代码使用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's answer中描述了另一种替代方法。

Answer 2

您需要执行此操作才能使代码正常工作：

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

我在使用pageswap时遇到了很多麻烦

2 个答案: