0

説明

constructorまず、jQueryと関数が混同されている可能性がありinitます。その場合は、以下の用語を無視してください。

と呼ばれるオブジェクトがありますSineMacula。これは、現時点では、メソッドのライブラリの名前空間として機能しているだけです。

ただし、SineMaculajQuery拡張機能のように動作させたいオブジェクトのメソッドをいくつか作成しようとしています。

ここで複雑さが発生します。jQueryエイリアスを使用する代わりに、オブジェクトを使用してjQueryコンストラクトを実行し$たいと思います。SineMaculaしたがって、事実上、私のコードは次のようになります。

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

それ以外の：

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

ただし、次のポイントがなければ、これはそれほど難しいことではないと思います。

jQuery全体にエイリアスを付けたくはありません。呼び出したときに、jQueryコンストラクターを実行しSineMacula('something')て、の結果にメソッドを適用するだけです。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て、オブジェクトに必要なライブラリと拡張機能をロードします。これにより、拡張機能がWebページに動的に読み込まれます。SineMaculasm.load({package:'all'})

ステップ4

拡張機能は次のように定義されます。

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

ステップ5-これは物事がもう少し複雑になるところです

これまで、オブジェクトはなどSineMaculaのメソッドの名前空間として機能していました。doSomething()

ここで、関数として機能するだけではないメソッドを定義したいと思います。

と呼んでいた場所で、jQueryと同じように動作する場所を呼び出せるようSineMacula.doSomething()にしたいと思います。SineMacula('#test').doSomething()SineMacula('#test')$('#test')

したがって、次のように関数にアクセスできます。

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

あなたが呼び出すことができるのと同じ方法で：

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

したがって、引数がSineMaculaオブジェクトに渡されると、jQueryセレクター関数を使用して処理され、呼び出されるメソッドのサブジェクトとして渡されます。

例えば：

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

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

要約すると...

SineMacula('selector')供給されている$('selector')かのように動作し'selector'、これは子メソッドに渡されます。ただしSineMacula、jQueryの拡張ではありません。SineMaculaのエイリアスになりたくありません$。

4

1 に答える 1

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");
        }
    }
};
于 2012-10-31T10:33:50.087 に答える