jQuery插件初始化绑定事件到窗口滚动-如何传递$this？

我的第一个插件使用了正确的体系结构，但我一直在研究如何将事件侦听器应用到$window。滚动以将globalMessage固定到窗口顶部。正在开发的完整插件可以在这里看到：，但是相关的部分是init，如下所示

设置修改目标元素css属性的窗口事件侦听器的最佳方法是什么

(function($){

    var methods = {
        init: function(options) {

            var $this = this;
            var opts = $.extend({}, $.fn.globalMessage.defaults, options);
            var data = $this.data('globalMessage');

            // init global data
            if ( ! data ) {
                $this.data('globalMessage', {
                    settings : opts
                });

                $(window).bind("scroll.globalMessage", function() {

                    // ----------
                    // HOW TO ACCESS both $this (defined outside this context)
                    // and the scrollTop value to change top css val?
                    //-----------
                    $this.css("top", $(window).scrollTop());

                });

                $this.bind('click.globalMessage', methods.hide);

            }

            return $this;
        },
        ...[other funcs]...
    }

    ...[main entry point etc]...

})(jQuery);

---

仔细想想，在methods对象的上下文中不存在这种情况。因此，您需要通过init调用传入它：

然后，在调用插件时，将其传递给init方法：

我唯一要提醒的是，在设置$this变量时，它实际上是一个jQuery对象，而不是一个特定的元素。所以我用了：

(function($){

    var methods = {
        init: function(sel, options) {

            var $sel = $(sel);

而且，对于在事件处理程序中使用$this，您需要重新定义它：

$(window).bind("scroll.globalMessage", function() {
    $this = $('#the_selector_for_your_element'); // Maybe $(this)?
    $this.css("top", $(window).scrollTop());
});

---

以正确的方式向事件传递变量：

$(window).bind("scroll.globalMessage", {foo:'bar'}, function(e) {
   alert(e.data.foo); // alert 'bar'
});

---

我一点也不清楚你的问题到底是什么。也许我不明白你在用窗口滚动事件做什么，但是如果你想让globalMessage停留在窗口的顶部，你能不能不使用position:fixed css？@nicky-假设你在页面的一半滚动，你想显示一条固定在窗口上的消息窗顶。在这种情况下，顶部为0的固定元素将不在视图中。@notbrain也许你是对的，这有点晚了-@nicky你非常清醒，似乎我是缺少css foo的人；位置：固定是更好的方式。thanksRe:从$.fn.plugin传递这个消息：我想我已经这样做了-因为如果我在init中调用console.logthis.attrid作为第一行，我会得到我期望的插件所附加的id。这在init上下文中不是已经是jQuery对象了吗？嗯，我正在使用的插件也有同样的问题，并用上面的代码解决了这个问题。对于事件处理程序，您需要为事件处理程序上下文重新定义$this，因为当调用它时，它将在调用时脱离上下文。@jared，检查一下：我疯了吗？或者这不等同于不需要从$.fn.globalMessage显式传递它的情况？感谢您的帮助…是的…用于调用methods数组中的函数的.apply函数负责在init函数中进行设置。看见

$(window).bind("scroll.globalMessage", function() {
    $this = $('#the_selector_for_your_element'); // Maybe $(this)?
    $this.css("top", $(window).scrollTop());
});

$(window).bind("scroll.globalMessage", {foo:'bar'}, function(e) {
   alert(e.data.foo); // alert 'bar'
});