Question

创建自己的jQuery方法时，为什么会这样做：

(function($){
    $.fn.test = function() {
        return this.each(function(){
            $(this).html("Hi there");
        });
    } 
})(jQuery);
$(document).ready(function(){
    $("body").click(function(){
        $(this).test().css("color", "orange");
    });
});

但这不是吗？

(function($){
    $.fn.test = function() {
        return this.each(function(){
            $(this).html("Hi there");
        });
    } 
    $("body").click(function(){
        $(this).test().css("color", "orange");
    });
})(jQuery);

我已尝试将$替换为jQuery，但仍然无效。它似乎只在一个单独的doc.ready函数中工作，有人可以解释为什么吗？

谢谢！

Answer 1

您的第二个代码段未按预期运行，因为

(function($) {...})(jQuery)

在文档准备好之前运行。

包装

$('body').click(function () {...})

里面的

$(document).ready(function() {...})

你告诉jQuery要运行

$('body').click(function () {...})
页面加载后
。

您（可能）想做的事情：

$(document).ready(function() { $.fn.test = function() { return this.each(function() { $(this).html("Hi there"); }); } $("body").click(function() { $(this).test().css("color", "orange"); }); });

这将同时运行

$.fn.test = function() {...}

和

$("body").click(function() {...}
在文档准备就绪之后
（这基本上是在页面完全加载时，它有点不同，但是在这里解释它并不具有建设性。）

为什么我的自定义功能不起作用？

1 个答案: