2

個々の呼び出しを行わずに初期化したいこのサンプルモジュールがありますが、消費者ページに配列を持たせて、各ページに必要なモジュールの名前を持つ小さな配列を持たせることができます。

私はこれを行いましたが、モジュールを呼び出しません:

var navModule = (function() {
    var nav = {};
    var navHTMLobjs = {
        navList: $('#nav'),
        listItems: $('#nav').find('li'),
        listLinks: $('#nav').find('a')
    };
    nav.bindOver = function() {
        navHTMLobjs.navList.on('mouseover mouseout', 'li a', function(e) {
            if (e.type == 'mouseover') {
                $(this).addClass('over');
            }
            if (e.type == 'mouseout') {
                $(this).removeClass('over');
            }
        });
    };
    nav.isOverBinded = function() {
        return navHTMLobjs.navList.data('events').hasOwnProperty('mouseover') && navHTMLobjs.navList.data('events').hasOwnProperty('mouseout');
    };
    nav.turnOff = function() {
        navHTMLobjs.navList.off('mouseover mouseout');
    };
    nav.isNavTurnedOff = function() {
        return !navHTMLobjs.navList.data.hasOwnProperty('events');
    };
    nav.init = function() {
        this.bindOver();
    };
    return nav;
});
//var myNav = new navModule($('#nav'));
//myNav.init();
// So I want to only include this array which will be written by 
//back end and each page will only have its required bits.
var pageModules = ['navModule'];
for (var m in pageModules) {
    var fn = window[pageModules[m]];
    //var fn = Function(pageModules[m]); This says navModule is not defined :(
    if (typeof fn === 'function') {
        var inner = new fn();
        inner.init();
    }
}

現在、fn を undefined として返します

また、これが正しい方法であるかどうか、そうでない場合は提案を教えてください。

ありがとう

4

3 に答える 3

1

コードをコピーアンドペーストで使用しconsole.log(fn);、if セグメントの前に追加すると、関数が の内容として表示されfnます。

あなたが得ている未定義は、inner.init()何も返さないという事実によるものかもしれません。

于 2012-07-17T10:58:29.000 に答える
1

これをチェックしてください。私にとってはうまくいくようです。 http://jsfiddle.net/sujay/ec8bU/

唯一の違いは、定義のvar前にあるキーワードを削除したことです。navModule

RequireJSのようなものを使用することをお勧めします

于 2012-07-17T12:07:25.023 に答える
1

要点がわからないかもしれませんが、匿名関数をカバーする括弧を削除すると、すぐには呼び出されず、経由で呼び出すことができますwindow[pageModules[m]]

あなたの場合、関数がすぐにnav.init -> nav.bindOverを呼び出すとき、returnステートメントがないため、結果は未定義です

var navModule = function() {
                var nav = {};
                var navHTMLobjs = {
                    navList: $('#nav'),
                    listItems: $('#nav').find('li'),
                    listLinks: $('#nav').find('a')
                };
                nav.bindOver = function() {
                    navHTMLobjs.navList.on('mouseover mouseout', 'li a', function(e) {
                        if (e.type == 'mouseover') {
                            $(this).addClass('over');
                        }
                        if (e.type == 'mouseout') {
                            $(this).removeClass('over');
                        }
                    });
                };
                nav.isOverBinded = function() {
                    return navHTMLobjs.navList.data('events').hasOwnProperty('mouseover') && navHTMLobjs.navList.data('events').hasOwnProperty('mouseout');
                };
                nav.turnOff = function() {
                    navHTMLobjs.navList.off('mouseover mouseout');
                };
                nav.isNavTurnedOff = function() {
                    return !navHTMLobjs.navList.data.hasOwnProperty('events');
                };
                nav.init = function() {
        console.log('i am called');
                    this.bindOver();
                };
                return nav;
            };
于 2012-07-17T11:40:52.240 に答える