5

HTML 要素でネイティブに使用できるイベント ハンドラーを検出する方法はありますか?

例えば：

isAvailable(img.onload) === true;    // All browsers
isAvailable(script.onload) === true; // Non-IE only (Webkit, Firefox, Opera)
isAvailable(link.onload) === true;   // IE (and I think Opera) only

onload理想的には、要素がそれを使用できる場合はスクリプトで機能検出を行い、そうでない場合はフォールバックします。script.onload現在、IE がlink.onload.

残念ながら、割り当てるelement.onloadと、最終的に発生するかどうかに関係なく、イベントは「未定義」ではなくなります。

4

7 に答える 7

0

これを試してください：

var d = document.createElement('div');

if(d.hasOwnProperty('onclick')) {
    //then onclick is supported
}

divの（または他のHTML要素を取得する）プロパティをループして、動的にチェックすることもできます。

var d = document.createElement('div'),
   el = 0;

for(el in d) {
    if(d.hasOwnProperty(el)) {
        console.log(d[el]); //or do anything else you like
    }
}

詳細については、 mozillaの開発ブログのhasOwnPropertyを確認してください。

于 2012-12-10T21:09:34.787 に答える
0

過去にこれを行った1つの方法は、古い「for in」ループを使用し、各キー値が「on」で始まるかどうかを確認することです（これまでに見たすべてのネイティブイベントハンドラーはこの方法で始まります。 。）たとえば、次のようになります。

var el = document.querySelector("*"), //this is the element (use whatever selector text)
elEventHandlers = [];                 //set up an array to hold 'em all

for (var prop in el)                  //loop through each prop of the element
    if (prop.substring(0,2)=="on")    //if the prop starts with "on" it's an event handler
        elEventHandlers.push(prop);   //so, add it to the array

console.log(elEventHandlers);         //then dump the array to the console (or whatever)

出来上がり！これで、その要素に登録できるイベントハンドラーがわかりました。

于 2012-02-08T02:44:17.080 に答える
0

(編集以下を参照してください。これは機能しません。)要素にonloadプロパティがあるかどうかを確認できます。

var img = document.createElement('img');
alert("img onload? " + ('onload' in img));
var script = document.createElement('script');
alert("script onload? " + ('onload' in script));

IE7 では、 と を取得しtrueます。imgfalsescript

編集これは Firefox では機能しません。他の人が同じ道をたどらないように、これをそのままにしておきます。

于 2010-05-19T09:50:12.273 に答える
0

以下は、Modernizrがイベント検出を行う方法から抽出した例です。

var tmp = document.createElement('script'); 
tmp.setAttribute('onload', '');
isSupported = typeof tmp.onload == 'function';
于 2011-11-22T12:46:56.563 に答える
0

これがあなたが求めていたものかどうかはわかりませんが、これにより、特定のオブジェクトで使用できる特定のメソッドまたはプロパティがあるかどうかがわかります。

var apple = new Object;
    apple.load = function() { alert("I am a method.") };
    apple.color = "red"

function isAvailable(obj, mp) { 
    // obj = element to test for method or property. 
    // mp = name of method or property. 

    if (obj[mp]) {
        return true;
    } else {
        return false;
    }
}

if (isAvailable(apple, "color")) {
    alert("apple object has a 'color' property");
}

if (isAvailable(apple, "load")) {
    alert("apple object has a 'load' method");
}

編集：例を示すために回答を作り直しました。

于 2010-07-02T00:44:51.583 に答える
0

I've done something like this before; when writing stuff for phone gap on the iphone, depending if you run the app in the simulator or on different versions of the device, you often have different handlers for handling the click of input buttons (and most other things)- so at the top of my script i just do a quick check;

var m_clickEvent = ''; 

if ( $('input').click != 'undefined')
   m_clickEvent = 'click'
else if ( $('input').tap != 'tap')
   m_clickEvent = 'tap'
else if ( $('input').touchstart!= 'touchstart')
   m_clickEvent = 'touchstart'
else 
   // some kind of error handling..

then i can go ahead and bind my event handler;

$('.myButton').bind(m_clickEvent, function(e) { ... });
于 2010-10-08T11:43:22.140 に答える
0 
isEventSupported =
    function(tag, event){
    return document.createElement(tag)[event]===null;
    };

>> isEventSupported("script", "onload"); 
true //on my current browser

このイベント サポートに関する誤った報告がベテランからもあります... 名前は言及しませんが、onload イベントが IMG 要素 SCRIPT 要素などで発生しない可能性が高いことは明らかではありません。キャッシュされ、リソースがキャッシュから引き出されている要素は、onload イベントを発生させません。

例外: ドキュメント要素は、readystate complete に依存するため、キャッシュされたファイルを操作している場合でも、onload イベントを発生させます。

于 2016-05-02T23:22:30.910 に答える