13

Perfection killsのおかげで、次の JavaScript を使用してイベント サポートを検出できます。

function hasEvent(ev) {
    var elem = document.createElement('a'),
        type = 'on' + ev,
        supported = elem[type] !== undefined;
    if (!supported) {
        elem.setAttribute(type, 'return;');
        supported = typeof elem[type] === 'function';
    }
    elem = null;
    return supported;
}

これは、私がそれを必要とするほぼ唯一の時間に機能しmouseenterます。サポートの検出。hasEvent('mouseenter')Chrome や Firefox などでは false を返します。

focusinしかし、現在、イベントとイベントをサポートしていないブラウザーを「修正」しようとしていfocusoutます。PPK によると、それは基本的に単なる Firefox です。残念ながら、次の理由により、Chrome と Safari は「不完全な」サポートとしてリストされています。

Safari と Chrome は、これらのイベントを addEventListener でのみ発生させます。従来の登録ではありません。

一般的には、それで問題ありません。とにかく使うだけaddEventListenerです。ただし、経由でのサポートの検出は機能しないことを意味しelem.onfocusin !== undefinedます。私はそれをテストしました、そしてそれは本当です：

<p>Do I support <a href="#">focusin</a>?</p>

<script>
var elem = document.getElementsByTagName('p')[0];

// hasEvent method defined here
function listener() {
    var response = hasEvent('focusin') ? 'Yes!' : 'No...';
    alert(response);
}

elem.addEventListener('focusin', listener, false);
</script>

No...Chrome で上記のアラートが表示されます。focusinブラウザ スニッフィングを使用せずに、ブラウザが をサポートしているかどうかを検出する方法はありますか?

4

3 に答える 3

4

focusin と focusout は、ターゲット要素がフォーカスを受け取る前に起動する必要があります。イベントの順序もバグがあるようです

http://www.w3.org/TR/DOM-Level-3-Events/#events-focusevent-event-order

現在、仕様に従って動作するのは IE のみです。

Chrome/Safari:
focus
focusin
DOMFocusIn
blur
focusout
DOMFocusOut
focus
focusin
DOMFocusIn

Opera 12:
focus
DOMFocusIn
focusin
blur
DOMFocusOut
focusout
focus
DOMFocusIn
focusin

IE 8:
focusin
focus
focusout
focusin
blur
focus

Firefox 14:
focus
blur
focus
于 2012-07-30T13:36:52.220 に答える
3

これは、呼び出しfocus()がトリガーされるという事実を使用しています：http focusin: //jsfiddle.net/pimvdb/YXeD3/。

要素は表示され、DOMに挿入される必要があります。そうfocusinでない場合、何らかの理由で起動されません。

var result = (function() {
    var hasIt = false;

    function swap() {
        hasIt = true; // when fired, set hasIt to true
    }

    var a = document.createElement('a'); // create test element
    a.href = "#"; // to make it focusable
    a.addEventListener('focusin', swap, false); // bind focusin

    document.body.appendChild(a); // append
    a.focus(); // focus
    document.body.removeChild(a); // remove again

    return hasIt; // should be true if focusin is fired
})();
于 2011-09-07T17:15:47.847 に答える