jQuery用一个对象扩展$.fn

jQuery extending $.fn with an object?

本文关键字：fn 扩展 一个对象 jQuery      更新时间：2023-09-26

使用jQuery.extend和jQuery.fn.extend之间的差异？有没有类似$('.selector').Group.Method();和$('.selector').Group.Method2(); 的方法

现在我有一个主脚本

function Forty() {};
var Forty = new Forty();
(function(site) {
    $.extend(Forty, {
        getBaseUrl: function(extra) {
            extra = typeof extra !== 'undefined' ? extra : '';
            return Forty.get('baseUrl') + extra;
        },
        get: function($what) {
            return site[$what];
        }
    });
})(site);

然后在该文件的后面，我有：

$.extend(Forty, {
    flyOut: function() {
        $(this).on('click', function() {
            $('html').toggleClass('nav-open');
        });
    }
});

最后我有：

$.fn.extend({Forty: Forty});

就在我有这条线之前：

$('.selector').Forty.flyOut();

所以我真的很喜欢$('.selector').Forty.flyOut();

这样的事情可能发生吗？

我设法解决了这个问题，方法是：

var Forty = {fn:{}};
$.fn.extend({Forty: function() {return $.extend(this, Forty.fn);}});

然后分配我自己的函数如下：

Forty.fn.flyOut = function() {
    $(this).on('click', function() {
        $('html').toggleClass('nav-open');
    });
    return this;
}

并像一样使用它们

$('.js-toggle-nav').Forty().flyOut();

这似乎非常奏效！

相关文章：