3

イベント ハンドラーを登録するためのクロスブラウザー機能と、(ほぼ) 一貫したハンドラー エクスペリエンスが必要です。jQuery などのライブラリの全重量や機能は必要ないので、独自のライブラリを作成しました。以下のコードで目標を達成したと思います。これまでのところ、テストは成功していますが、あまりにも長い間見つめていました。私のロジックに欠けている欠陥や落とし穴はありますか?

EDIT 1：明確にするために、ブラウザの意図で各ブロックにコメントを付けました。IE ブロックを更新して、すぐに呼び出さないようにしました ( Andy E の鋭い目 のfuncおかげです)。

編集 2:func.call()のthis代わりに で呼び出すように IE ブロックを更新しましelemた。

編集 3:「良い部分」でJSLintを渡すように更新されました。

function hookEvent(elem, evt, func)
{
    if (typeof elem === "string")
    {
        elem = document.getElementById(elem);
    }
    if (!elem)
    {
        return null;
    }
    var old, r;
    if (elem.addEventListener)  //w3c
    {
        elem.addEventListener(evt, func, false);
        r = true;
    }
    else if (elem.attachEvent)  //ie
    {
        elem[evt + func] = function ()
        {
            func.call(this, window.event);
        };
        r = elem.attachEvent("on" + evt, elem[evt + func]);
    }
    else                        //old
    {
        old = elem["on" + evt] ? elem["on" + evt] : function (e) { };
        elem["on" + evt] = function (e)
        {
            if (!e)
            {
                e = window.event;
            }
            old.call(this, e);
            func.call(this, e);
        };
        r = true;
    }
    return r;
}
4

1 に答える 1

3

この行に問題があります:

r = elem.attachEvent("on" + evt, func.call(elem, window.event));

これにより、 func()がイベントのハンドラーとしてアタッチされる代わりに、すぐに実行されます。代わりに、func()の戻り値がイベントに割り当てられ、型が not である場合はエラーがスローされます"function"。

あなたがフレームワークを使いたくないのは理解できますが、他の多くの (多くの) 人がクロスブラウザー イベント処理スニペットを作成しています。 John Resigには 1 つのバージョンがあり、Google は "javascript addEvent" を多くのバージョンに対応しています。

http://www.google.com/search?q=javascript+addevent

于 2010-08-25T17:54:59.013 に答える