web-dev-qa-db-ja.com

window.openで開かれたウィンドウのonloadイベントを検出する

 window.popup = window.open($(this).attr('href'), 'Ad', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0');
 $(window.popup).onload = function()
        {
                alert("Popup has loaded a page");
        };

これは、私が試したどのブラウザー（IE、Firefox、Chrome）でも機能しません。ページがウィンドウにロードされたとき（iframe onloadなど）を検出するにはどうすればよいですか？

javascriptinternet-explorerfirefoxgoogle-chromepopup
35
Christopher Tarquini

ポップアップのドキュメントが別のドメインからのものである場合、これは単に不可能です。

2015年4月更新：私はこれについて間違っていました：両方のドメインを所有している場合、 window.postMessageとmessageイベントを使用できます in ほとんどすべてのブラウザ 今日関係がある。

そうでない場合は、ポップアップに読み込まれているドキュメントの助けがなければ、この作業をクロスブラウザにすることはできません。ポップアップが読み込まれると、ポップアップページのJavaScriptが独自のloadイベントを処理するときに設定する変数など、ポップアップの変化を検出できる必要があります。あなたはそれをある程度制御することができます。オープナーの関数に呼び出しを追加できます。

19
Tim Down
var myPopup = window.open（...）; 
 myPopup.addEventListener（ 'load'、myFunction、false）;

IEが気になる場合は、代わりに2行目として次を使用します。

myPopup [myPopup.addEventListener？ 'addEventListener'： 'attachEvent']（
（myPopup.attachEvent？ 'on'： ''）+ 'load'、myFunction、false 
）;

ご覧のとおり、IEのサポートは非​​常に面倒であり、避けるべきです可能であれば。つまり、IE =視聴者のために、必ずそうしてください。

50
Delan Azabani

前述のように、この答えは https://stackoverflow.com/a/303089 aka window.openで開かれたウィンドウのonloadイベントを検出する ソリューションが理想的です。

javascript: /* IE will use 1 ignore 1 w/ error, FF t'other way 'round */
 (function(ow){
   ow . addEventListener(  'load', function(){alert("loaded")}, false);
   ow .      attachEvent('onload', function(){alert("loaded")}, false);
  }(window.open(Prompt("Where are you going today?",location.href),"snapDown")))

ただし、他のコメントと回答は、以下で説明するように、いくつかの誤った誤解を犯します。

次のスクリプトは、onloadを定義することの気まぐれな一時的な気まぐれさを示しています。問題を確認するには、location.hrefなどの高速読み込みfile:///といくつかの低速サイトにスクリプトを適用します。 onloadメッセージを表示することも、まったく表示しないこともできます（ロードされたページをリロードすると、3つのバリエーションがすべて表示されます）。また、ロードされるページ自体は、問題を悪化させるonloadイベントを定義しないと想定されています。

onloadのイベントハンドラー定義は、最終的にbodyのHTML ...のDOMに常駐しますが、「ポップアップのHTMLマークアップ内」ではありません。

javascript:
window.popup=window.open(location.href,'snapDown');
window.popup.onload=function(){alert("message one ")};
alert("message 1 maybe too soon\n"+window.popup.onload);
window.popup.onload=function(){alert("message two")};
alert("message 2 maybe too late\n"+window.popup.onload);

できること：

  • 外部URLを開く
  • その外部URLにアドレスバーはjavascript: ... URIを入力します
    外部サイトのURLと同じサイトポリシーを継承します
    NB。アドレスバーURI javascript:は最近（2012年頃）のブラウザでは有効ではないため、javascriptをブックマークレットとしてブックマークする必要がある場合があります。
  • これにより、クロスドメインアクセスが効果的に提供されますが、注意：
    1. javascriptはWebページまたはサイト固有のnotです。つまり、Originはステートレスな国籍を持っているため、本質的にcss（x-siteスクリプト）およびsopを満たします。 （同じ起源ポリシー）移民規則
    2. アドレスバーまたはブックマークを介して手動で呼び出されますAND
      スクリプトは、手動でそれらの場所に入力されます

したがって、Originに関係なく、ほとんどすべてのページを次のように変更できます。

javascript:
  if(confirm("wipe out links & anchors?\n"+document.body.innerHTML))
     void(document.body.innerHTML=document.body.innerHTML.replace(/<a /g,"< a "))

（よくほとんど ...
jar:file:///usr/lib/firefox/omni.ja!/chrome/toolkit/content/global/aboutSupport.xhtml
MozillaのFFトラブルシューティングページおよびその他のjarアーカイブは例外です）

別の例として：
GoogleによるターゲットPGの奪取を定期的に無効にします。ヒットした場合は、rwt関数を次のように変更します。

javascript:void(rwt=function(unusurpURL){return unusurpURL})

これをspay google（neuteralize google？）としてブックマークします。それは「修正済み」です。

このブックマークはgoogleヒットがクリックされる前にクリックされるため、それらのヒットのブックマークはクリーンであり、googleによって作られた雑多な異常な異常ではありません。

で行われたテスト

window.navigator.userAgent=
Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:11.0) Gecko/20100101 Firefox/11.0

MozillaのaddEventListenerには、非標準の4番目のブールパラメータのみがあり、trueが信頼できないコンテンツトリガーを外部ページに対してインスタンス化できる場合にのみ注意してください。

ref：
element.addEventListener |ドキュメントオブジェクトモデル（DOM）| MDN：
特権ページと非特権ページの相互作用|コードスニペット| MDN：

ブックマーク：
window.openで開かれたウィンドウのonloadイベントの検出

6
ekim

これは私にとってのトリックでした。完全な例：

HTML：

<a href="/my-popup.php" class="import">Click for my popup on same domain</a>

Javascript：

(function(){
    var doc = document;

    jQuery('.import').click(function(e){
        e.preventDefault();
        window.popup = window.open(jQuery(this).attr('href'), 'importwindow', 'width=500, height=200, top=100, left=200, toolbar=1');

        window.popup.onload = function() {
            window.popup.onbeforeunload = function(){
                doc.location.reload(true); //will refresh page after popup close
            }
        }
    });
})();
3
Sebastiaan Ordelman

onloadイベントハンドラは、ポップアップのHTML内にある必要があります<body>マークアップ。

1
Thevs

コアの問題は、コンテンツがブラウザにすでにキャッシュされているページを表示するためにウィンドウを開いていることのようです。したがって、ロードは発生しないため、ロードイベントは発生しません。

1つの可能性は、代わりに「pageshow」イベントを使用することです。

https://support.Microsoft.com/en-us/help/3011939/onload-event-does-not-occur-when-clicking-the-back-button-to-a-previo

0
Panu Logic