web-dev-qa-db-ja.com

JavaScriptオブジェクトがイベントであるかどうかを判断する方法は？

JavaScriptオブジェクトがイベントであるかどうかを判断する最も安全な方法は何ですか？

javascriptjavascript-events
43
Tom

おそらく「不明」なオブジェクトを調べて、期待するプロパティとメソッドを探すことは、かなり良い習慣です。

したがって、haveがイベントオブジェクトを取得し、アクションを実行する前にそれを調査するとします。

if (event.target)
{
   //looks like we're an event, hide the target
   var e=$(event.target);
   e.hide();
}

イベントであるかどうかを確認するために「ターゲット」をテストすることはお勧めしません。そのプロパティを使用しようとしているため、ターゲットをテストしています。私が運転しているのは、オブジェクトがイベントであるかどうかを判断する代わりに、オブジェクトをプローブして、期待どおりに動作するかどうかを確認し、それらの動作を使用することです

このようなコードは、サポートが異なるブラウザでは適切に機能を低下させるか、ブラウザ固有の拡張機能を利用できるようにする必要があります。

if (event.initKeyEvent)
{
    //gecko 1.9+
    event.initKeyEvent(...)
}
48
Paul Dixon

instanceof を使用するのはどうですか？イベントオブジェクトがコンストラクタnew Event()を使用して作成されている限り、たとえば：

var e = new Event('click');
e instanceof Event; // true

イベントハンドラーのイベントパラメーターの場合、その型はObjectですが、プロパティとしてネイティブイベントが含まれているため、これを代わりに使用できます。

function myEventHandler(e) {
   e.originalEvent instanceof Event; //true
}

ここで、実際の値はブラウザーによって異なる場合があることに注意してください。特に、イベントがタッチイベントの場合は、 ここ とその中の参照を参照してください。私の場合は問題ありません。

33
Felix

オブジェクトにプロパティoriginalEventがあるかどうかを確認できます。

event.hasOwnProperty('originalEvent')

例えば：

// var event
var
  isObject = typeof event  ==='object', // is the given argument an object
  isEvent  = isObject ? event.hasOwnProperty('originalEvent') : false; 
if(isEvent) {
  // var `event` is an event!
} else {
  // var event is NOT an event!
}
4
Mark Teunissen

古い質問ですが、明らかにこれによると、event.typeはクロスブラウザです：

http://www.quirksmode.org/js/events_properties.html

RameshVelはこれを編集の中で彼の回答に追加しましたが、かなり反対票が投じられました。

もちろん、最も安全な方法は、受け入れられた回答のガイダンスに従うことですが、たまたま、それがイベントである場合はオブジェクトを破棄したいと思いました。

3
Adam Marshall

このisEvent関数は、不明なオブジェクトのコンストラクターをチェックし、それを文字列に変換してから、既知のイベントタイプを検索します。

function isEvent(o){
    //grab the constructor for the unknown object
    var c=o.constructor;
    //convert constructor to string
    var s=c.toString(); 
    /* declare IE RegExp pattern to match for 'object [Event]' */
    if(document.all){
        //set regExp pattern for IE
        var ptr=/\[object Event\]/;     
    }else{
        /* declare FIREFOX regExp pattern to match for 'object [*Event]' since it has
           several event types:
        UIEvent 
        KeyboardEvent
        MouseEvent
        FocusEvent
        WheelEvent
        CompositionEvent
        StorageEvent
        CustomEvent (Requires Gecko 6.0)
        MutationEvent

        Both Custom and Mutation events are not recognized prior to Gecko 6.0,
        so if you want to use these, adjust regExp accordingly */
        var ptr=/\[object (Keyboard|Mouse|Focus|Wheel|Composition|Storage)Event\]/; 
    }   
return ptr.test(s);  }
3
Cypher

それを確実に行う方法があるかどうかはわかりませんが、ベストショットはダックタイピングだと思います。

とにかく、状況に応じて、 Paul が指摘するように、特定のオブジェクトに使用したい期待されるプロパティがあるかどうかを確認できます。

0
Pablo Cabrera

私も同じ懸念を抱いています。それで私は証明に着手し、解決策に近づきました。

function isEvent(a){
    var txt, es=false;
    txt = Object.prototype.toString.call(a).split('').reverse().join('');
    es = (txt.indexOf("]tnevE") == 0)? true: false; // Firefox, Opera, Safari, Chrome
    if(!es){
        txt = a.constructor.toString().split('').reverse().join('');
        es = (txt.indexOf("]tnevE") == 0)? true: false; // MSIE
    }
    return es;
}

私はこの機能をテストしました

  • FFおよびOpera Ubuntu 11.64上の12.0
  • Wine-Ubuntu上のSafari 5.0
  • WinXP上のG.Chrome 19およびMSIE 8

これがお役に立てば幸いです。

0
patocardo