jquery - jquery插件中的事件仅使用插件使用的最后一个选择器？

Question

<script>
(function($, window, document, undefined) {
    $.fn.testPlugin  = function(options) {
        this.each(function() {
            $$ = this;
            $(window).on('scroll',function() {
                console.log($$);
            })
        });
    }
})(jQuery, window, document)
$("#block1").testPlugin();
$("#block2").testPlugin();
<script>

为什么它只显示#block2 元素而不是同时记录block1 和block 2？

Answer 1

这是因为$$被定义为全局（在浏览器的情况下为窗口）而不是本地（由于没有 var），这导致它的值是使用插件的最后一个元素，覆盖任何其他以前的元素。只需var在插件函数内部定义它，它应该可以正常工作。

this.each(function () {
            var $$ = this; //<-- Here
            $(window).on('scroll', function () {
                console.log($$);
            })
        });

演示