简体   繁体   English

如何使jQuery插件函数可以独立使用,不能在集合上运行

[英]How to make a jQuery plugin function callable for stand-alone use, that does not operate on a collection

I read the jquery documentation of plugin authoring and am familiar with that. 我阅读了插件创作jquery文档,并熟悉它。 However, the examples given always operate on a set of previously matched elements. 但是,给出的示例始终对一组先前匹配的元素进行操作。 I want to create a function that can do both: 我想创建一个可以同时执行这两项操作的函数:

// example usage of my to-be-created plugin function

// this is the way described in the docs, and I know how to do that
$("a").myFunction ()

// but I also want to be able to call the function without a collection:
$.myFunction ();

If $.myFunction () is called without a collection to operate on, it would create it's own collection of what elements to match - kind of an initialization process (but not necessarily run only once). 如果在没有要操作的集合的情况下调用$.myFunction () ,它将创建它自己的要匹配的元素集合 - 一种初始化过程(但不一定只运行一次)。 Also, $.myFunction () should maintain chainability. 此外, $.myFunction ()应保持可链接性。

The pseudocode of what I want to achieve: 我想要实现的伪代码:

// [...]
function myFunction (): {
    if (notCalledOnACollection) {
        // this should run when called via $.myFunction ()
        $elements = $("a.myClass");
    }
    else {
        $elements = $(this);
    }
    return $elements.each (function () {
        // do sth. here 
    });
}

I would really like to keep all of the functions implementation/functionality within a single function definition, and not have two separately named functions or two equally named functions in two separately places within the jQuery object. 我真的希望将所有函数实现/功能保留在单个函数定义中,并且在jQuery对象中的两个单独位置中没有两个单独命名的函数或两个同名函数。

And of course I could add a parameter myFunction (do_init) that indicates what branch of the if statement to execute, but that would clutter my argument list (I want to use that approach for multiple plugins, and there will be argumentes to myFunction () that I just left out here for simplicity). 当然我可以添加一个参数myFunction (do_init)来指示要执行的if语句的哪个分支,但这会使我的参数列表混乱(我想对多个插件使用该方法,并且会有myFunction ()参数为了简单起见我刚刚离开这里。

Any good suggestions? 有什么好建议吗?

By simply adding another reference in the plugin definiton, you can easily use the standard plugin code: 只需在插件定义中添加另一个引用,您就可以轻松使用标准插件代码:

(function( $ ) {
    $.myPlugin = $.fn.myPlugin = function(myPluginArguments) {
        if(this.jquery)
            //"this" is a jquery collection, do jquery stuff with it
        } else {
            //"this" is not a jquery collection
        }
    };

    $.fn.myPlugin.otherFunc = function() {
    };
})( jQuery );

The only difference here is the $.myPlugin = part which allows you to directly call your plugin without running jquery's selector function. 这里唯一的区别是$.myPlugin = part,它允许你直接调用你的插件而不运行jquery的选择器函数。 Should you decide you need other functions or properties, you can create them as properties of your plugin. 如果您确定需要其他功能或属性,可以将它们创建为插件的属性。

Usage: 用法:

//using a selector (arguments optional)
$(".someClass").myPlugin();

//using the options variable - or whatever your arguments are
$.myPlugin({id: "someId"});

//accessing your other functions/properties
$.myPlugin.otherFunc();

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM