Question

说明

首先，我可能会在jQuery constructor和init函数之间混淆，如果是这样，请忽略我的术语。

我有一个名为SineMacula的对象，目前只是作为方法库的命名空间。

但是，我即将为SineMacula对象编写一些方法，我希望它们像jQuery扩展一样。

这里出现了复杂性，而不是使用jQuery别名$，我想使用SineMacula对象来运行jQuery构造。所以我的代码看起来会像这样：

SineMacula('#test').dropdown();

而不是：

$('#test').dropdown();

然而，如果不是我的下一点，我认为这不会太难：

我不想为整个jQuery添加别名，我只想在调用SineMacula('something')时运行jQuery构造函数，然后将任何方法应用于SineMacula('something')的结果

我的问题

提出这个问题的最好方法是说明。以下是可能的吗？

SineMacula('#test').someFunction(function(){
    // Do something here
    // The jQuery object must be passed in so that
    // $(this) refers to SineMacula('#test')
});

但是，我不希望能够做到这一点（完全别名jQuery）：

SineMacula('#test').animate(); // A regular jQuery function

我知道这可能不可能，但觉得值得问： - ）

更新1

为了清楚起见，这是我目前用于SineMacula对象的一些代码：

/**
 * Sine Macula Javascript  API
 * The Sine Macula API contains all base functions for use throughout
 * all websites
 * @name class.sinemacula.js
 * @author Ben Carey
 * @version 1.0
 * @date 25/10/2012
 * @copyright (c) 2012 Sine Macula MMVIII Limited (sinemacula.co.uk)
 */

function SineMacula(){

    // Only proceed if jQuery has been loaded
    if(typeof jQuery=='undefined'){
        // jQuery has not been loaded
        console.log('jQuery has not been loaded');
    }else{

        /**
         * Sine Macula Load
         * Load the Sine Macula Libraries and Plugins
         * into the current document
         *
         * The options:
         * - package: the package of libraries to load
         * - packageURL: a remote source to load the package details from
         * - libraries: any additional libraries to load
         *
         * @param object options The options for the Sine Macula load
         */
        this.load = function(options){
            // Load Sine Macula Libraries here
        }
    }
};

/**
 * Overlay
 * Place an overlay on the page
 *
 * The options:
 * - wrapper: the wrapper to prepend to
 * - fade: indicate whether or not to fade the overlay
 * - fadeSpeed: the fade speed for the overlay fade
 * - opacity: the opacity to apply to the overlay
 * - color: the color to apply to the overlay
 * - callback: the callback to be called once the function has completed
 *
 * @param boolean showHide A boolean to indicate whether to show/hide the overlay
 * @param object options The options for the overlay
 */
SineMacula.prototype.overlay = function (showHide,options){
    // Process the overlay here
};

// All libraries are extended onto the SineMacula object

SineMacula对象在每个页面的顶部启动，如下所示：

<script src="//libraries.example.net/jsapi" language="javascript" type="text/javascript"></script>
<script language="javascript" type="text/javascript">

    var sm = new SineMacula();
    sm.load();

</script>

更新2 - 忽略上方

是的，我发现很难解释我想要实现的目标。我将尽力在以下步骤中完成此操作，忽略上述内容。

第1步

我有一个名为SineMacula的类，它包含许多可以执行各种操作的方法。可以把它想象成像jQuery这样的库。

这个定义如下：

function SineMacula(){

    // Only proceed if jQuery has been loaded
    if(typeof jQuery=='undefined'){
        // jQuery has not been loaded
        console.log('jQuery has not been loaded');
    }else{
        this.load = function(options){
            // Load Sine Macula Libraries here
        }
    }
};

第2步

使用以下代码在每页顶部启动SineMacula类：

<script src="//libraries.example.net/jsapi" language="javascript" type="text/javascript"></script>
<script language="javascript" type="text/javascript">

    var sm = new SineMacula();

</script>

第3步

SineMacula对象然后通过调用例如SineMacula对象来加载任何所需的库和扩展。 sm.load({package:'all'})。这会将任何扩展动态加载到网页中。

第4步

扩展名的定义如下：

SineMacula.prototype.doSomething = function(){
    // Do something here
}

第5步 - 这是事情变得更复杂的地方

到目前为止，SineMacula对象一直充当doSomething()等方法的命名空间。

我现在想要定义的方法不仅仅是作为一个函数。

我打电话给SineMacula.doSomething()的地方，我现在想能够致电SineMacula('#test').doSomething()，其中SineMacula('#test')的行为与$('#test')相同在jQuery中。

所以我可以像这样访问我的函数：

SineMacula.doSomething('maybe parameters here');
SineMacula('selector').doSomethingElse('maybe parameters here');

以同样的方式致电：

$.ajax('parameters');
$('selector').animate('parameters');

所以如果将一个参数传递给SineMacula对象，那么它将使用jQuery selector 函数进行处理，并作为主题传递给被调用的方法

例如：

// Call doSomethingElse on the #test element
SineMacula('#test').doSomethingElse();

// Within the doSomethingElse function $(this) relates to $('#test')

总结......

如果提供SineMacula('selector')，则

$('selector')充当'selector'，并将其传递给子方法。但SineMacula不是jQuery的扩展。我不希望SineMacula成为$的别名。

Answer 1

如果我理解了这个问题，您是否可以更改SineMacula构造函数

function SineMacula(){
     // add following 3 lines
     if(arguments.length>0) {
        return jQuery.call(null,arguments);
     }
    // Only proceed if jQuery has been loaded
    if(typeof jQuery=='undefined'){
        // jQuery has not been loaded
        console.log('jQuery has not been loaded');
    }else{

        this.load = function(options){
            // Load Sine Macula Libraries here
            console.log("ok load");
        }
    }
};

扩展jQuery，包括另一个对象中的jQuery构造函数

说明

我的问题

更新1

更新2 - 忽略上方

1 个答案: