0

ここでの私の問題：なぜこのコードが機能しないのですか????? ...メッセージが表示されない

イベントクリック時に要素xにイベントリスナーを追加しようとしています 

    function test()
    {
    alert("test");
    }

var EventsCrossBrowsers = 
 {
    addEvents:(function(element,event,func)
              {
                    if(element.addEventListener)
                    {
                        return elemenet.addEventListener(event,func,false);
                    }
                    else if(elemenet.attachEvent)
                    {
                        return elemenet.attachEvent("on"+event,func);
                    }
              }());
 }

 var x =document.getElementById("test");

EventsCrossBrowsers.addEvents(x,"click",test);

たくさんのjfriend00に感謝します....私が思う最も単純な方法：-

function test()
{
    alert("test");
}

function addEventsCrossBrowsers(elemenet,event,func)
{
    if(elemenet.addEventListener)
    {
        elemenet.addEventListener(event,func,false);
    }
    else if(elemenet.attachEvent)
    {
        elemenet.attachEvent("on"+event,func);
    }
}
var x =document.getElementById("test");
addEventsCrossBrowsers(x,"click",test);

あなたの2番目の方法は私がリターンを理解していないことを除いてほとんど同じです...もう一度ありがとう...

4

1 に答える 1

15

あなたの関数では、両方を使用しているようですelemenetがelement、同じスペルである必要があります。それは少なくとも問題の一部です。

また、あなたのaddEvents関数は自己実行関数であり、この点では意味がありません。正常な機能のようです。

これが私のクロスブラウザイベント関数です。イベントハンドラーを追加するための1つの関数を作成するだけでなく、thisポインターとeventsオブジェクトを正規化して、どのブラウザーでも同じように扱うことができるようにします。

// add event cross browser
function addEvent(elem, event, fn) {
    // avoid memory overhead of new anonymous functions for every event handler that's installed
    // by using local functions
    function listenHandler(e) {
        var ret = fn.apply(this, arguments);
        if (ret === false) {
            e.stopPropagation();
            e.preventDefault();
        }
        return(ret);
    }

    function attachHandler() {
        // set the this pointer same as addEventListener when fn is called
        // and make sure the event is passed to the fn also so that works the same too
        var ret = fn.call(elem, window.event);   
        if (ret === false) {
            window.event.returnValue = false;
            window.event.cancelBubble = true;
        }
        return(ret);
    }

    if (elem.addEventListener) {
        elem.addEventListener(event, listenHandler, false);
        return {elem: elem, handler: listenHandler, event: event};
    } else {
        elem.attachEvent("on" + event, attachHandler);
        return {elem: elem, handler: attachHandler, event: event};
    }
}

function removeEvent(token) {
    if (token.elem.removeEventListener) {
        token.elem.removeEventListener(token.event, token.handler);
    } else {
        token.elem.detachEvent("on" + token.event, token.handler);
    }
}

伝播とデフォルトの防止オプションはなくthis、event正規化を使用した、より単純なバージョンが必要な場合は、次のようになります。

// add event cross browser
function addEvent(elem, event, fn) {
    if (elem.addEventListener) {
        elem.addEventListener(event, fn, false);
    } else {
        elem.attachEvent("on" + event, function() {
            // set the this pointer same as addEventListener when fn is called
            return(fn.call(elem, window.event));   
        });
    }
}
于 2012-04-14T00:43:22.363 に答える