0

iFrame を対象とするファイル アップロードを使用して、単純なフォームをコーディングしようとしています。私はそれをかなりカバーしましたが、Internet Explorer は動的に生成された iFrame のロード メソッドをサポートしていないため、別の方法を実行する必要があります。私の質問は - Javascript を使用してブラウザの種類を識別するための最良かつ最も正確な (さらに軽い) 方法は何ですか?

Modernizrが特定のメソッド/プロパティをチェックできることは知っていますが、この特定のシナリオで役立つかどうかはよくわかりません。はModernizr.hasEvent()ありますが、動的に作成された要素を確認するために使用することはできません。

4

3 に答える 3

1

特定のイベントのサポートを確認したい場合は、次のようなことを試すことができます:

var isEventSupported = (function(){
    var TAGNAMES = {
      'select':'input','change':'input',
      'submit':'form','reset':'form',
      'error':'img','load':'img','abort':'img'
    }
    function isEventSupported(eventName) {
      var el = document.createElement(TAGNAMES[eventName] || 'div');
      eventName = 'on' + eventName;
      var isSupported = (eventName in el);
      if (!isSupported) {
        el.setAttribute(eventName, 'return;');
        isSupported = typeof el[eventName] == 'function';
      }
      el = null;
      return isSupported;
    }
    return isEventSupported;
  })();

上記のライブデモは次のとおりです。

http://kangax.github.com/iseventsupported/

于 2012-08-13T11:40:54.560 に答える
1

私の考えでは、これを確認する最も簡単な方法は次のとおりです。

if ('onload' in iFrameVar)
{
    console.log('your code here');
}

もちろん、iFrameVar は iframe への参照です。

function elemSupportsEvent(elem,e)
{
    var f = document.createElement(elem);
    if (e in f)
    {
        console.log(elem + ' supports the '+ e + ' event');
        return true;
    }
    console.log(elem + ' doesn\'t support the '+ e + ' event');
    return false;
}
elemSupportsEvent('iframe','onload');//logs "iframe supports the onload event" in chrome and IE8

関数を使用してさまざまな要素でのイベントのサポートを確認する方法の例を簡単に説明します。

あなたのコメントに応えて: ajax 応答のように、動的コンテンツを確認したい場合は、単にreadystatechangeイベントを使用できます:

xhr.onreadystatechange = function()
{
    if (this.readyState === 4 && this.status === 200)
    {
        var parent = document.getElementById('targetContainerId');//suppose you're injecting the html here:
        parent.innerHTML += this.responseText;//append HTML
        onloadCallback.apply(parent,[this]);//call handler, with parent element as context, pass xhr object as argument
    }
};
function onloadCallback(xhr)
{
    //this === parent, so this.id === 'targetContainerId'
    //xhr.responseText === appended HTML, xhr.status === 200 etc...
    alert('additional content was loaded in the '+ this.tagName.toLowerCase+'#'+this.id);
   //alerts "additional content was loaded in the div/iframe/td/whatever#targetContainerID"
}
于 2012-08-13T11:41:31.840 に答える
0

を使用しnavigator.userAgentます。ブラウザのユーザーエージェントが含まれています

if (navigator.userAgent.search("MSIE 6") == -1){
    // We've got IE.
}
于 2012-08-13T11:36:02.187 に答える