0

まず第一に：私の悪い英語でごめんなさい。

次の形式でJavaScriptオブジェクトを入力する関数を作成しています。

var input = {
    'selector1' : {
        'event1'    : function(element,value){
            // ...
        },
        'event2'    : function(element,value){
            // ...
        },
        ...
        'eventN'    : function(element,value){
            // ...
        }
    },
    'selector2' : {
        'event1'    : function(element,value){
            // ...
        },
        'event2'    : function(element,value){
            // ...
        },
        ...
        'eventN'    : function(element,value){
            // ...
        }
    }
}

私の関数は次のようにイベントをバインドします。

function event_binder(events_fns){
    for(sel in events_fns){
        for(ev in events_fns[sel]){
            $(sel).on(ev,function(){
                console.log(sel+'+'+ev);
                var th = $(this);
                var func_to_call = events_fns[sel][ev];
                func_to_call(th,th.html());
            });
        }
    }
}

しかし、実行すると、すべてのイベントが最後のイベントにバインドされていることが示されます。

問題をよりよく説明するためにjsFiddleを作成しました：http： //jsfiddle.net/Polmonite/6rRgr/

console.logが示唆しているように、イベントバインディングは常にオブジェクトの最後の関数を使用しているようです。私が正しく解釈している場合、「。on」関数の評価は最後にのみ行われるように見えるので、「sel」変数と「ev」変数の最後の値を使用します（スコープの問題）が、私はしませんそれを修正する方法を完全に理解していません。

ありがとうございました。

編集：私は1つのことを指定する必要があります：単なる例であるjsfiddleの動作バージョンではなく、'event_binder'関数の動作バージョンを作成したいです。

4

1 に答える 1

2

問題はスコープです。関数全体に1つselのev変数しかなく、毎回上書きされます。（独自の変数を使用して）新しいスコープを作成するには、それらを独自の関数でラップする必要があります。幸い、jQueryには、関数を渡すことができる反復関数が用意されているため、この問題は発生しません$.each。http://jsfiddle.net/6rRgr/3/を参照してください。

$.each(events_fns, function(sel, funcs) {
    $.each(funcs, function(ev, func) {
        $(sel).on(ev,function(){
            console.log(sel+'+'+ev);
            var th = $(this);
            func(th,th.html());
        });
    });
});
于 2013-01-04T11:07:03.750 に答える