ポップアップウィンドウ内の空のDOM

私は複数のフレームにまたがる必要があるポップアップウィンドウを持っているので、私はwindow.createPopupを使ってこれを動作させています。ポップアップウィンドウ内の空のDOM

function ShowMyPopup() { 
    notificationPopup = window.createPopup(); 
    $(notificationPopup.document.body).load("/notification.html"); 
    notificationPopup.show($(sourceFrame.document.body).width() - 510, $(sourceFrame.document.body).height() - (510 - $(sourceFrame.document.body).height()), 500, 500, sourceFrame.document.body); 
}

これはかなりうまく動作するようです：（IE6、7、および8）は、以下

私はポップアップを作成するために使用している機能です。私はポップアップウィンドウが表示されます。問題は、私が何をしても、結果として得られるポップアップウィンドウのDOM要素にアクセスできないように思えることです。私はさまざまなjQueryメソッドとまっすぐなgetElementByIdを試してみましたが、すべてNULLを返します。以下はnotification.htmlの内容は次のとおりです。

<html> 
<head> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      alert($(document).html()); 
      alert($("#divNotification").html()); 
      alert(document.getElementById("divNotification")); 
     }); 
    </script> 
</head> 
<body> 
    <div id="divNotification" onclick="$(this).toggle();"> 
     <h3>Some Notification!</h3> 
     Testing 1234... 
    </div> 
</body> 
</html>

私は3つのアラートを参照してくださいので、私はjQueryのが動作していることを知っているが、3つのすべてのアラートは、単に「NULL」を示しています。結果のdivをクリックすると、onClickは発生しますが、 "Object Expected"エラーが発生します。

ここでは何が起こっていますか？

出典

2012-04-16 RMD

デモでは、jQueryは含まれていません。 –

あなたは '$（document）.html（）'を使ってドキュメントのhtmlを取得しようとしています。あなたは '（ "html"）.html（）'を使用するべきです。これにより、最初のアラートはnullを返します。他の2つは、アクセスしようとするときにDOMが準備ができていないことが原因です。遅延させるためにタイムアウトを追加してみてください。 –

Rob-jQueryは親ページに含まれており、見た目ではポップアップで動作します。（あるいはそうでないかもしれませんが）どんなレートであれ、notification.htmlのref jQueryにスクリプトタグを追加しても違いはありません – RMD

OKとメインウィンドウに対応しています。私はこれを考え出した。それはかなり直感的です。

基本的に、関連するすべてのjavascriptライブラリをソースフレームに読み込むことになりました。これらのメソッドにアクセスするには、その名前でソースフレームを明示的に参照する必要があります。

任意のjavascriptの場合 - 内のポップアップウィンドウにもJavascriptを - ポップアップウィンドウのDOMにアクセスすることを望んでいる、あなたはそれを完全に修飾する必要があります（またはjQueryの意志正しいルートオブジェクトを提供）、それが機能するために。

function MakePopupRed() { 
    if (notificationPopup) { 
     $("#divNotification", notificationPopup.document).css("background-color", "red"); 
    } 
}

だから、基本的に、ジャバスクリプトがあるということが表示されます：私のソースフレームの参照JavaScriptライブラリで、今

<div id="divNotification" onclick="top.SourceFrame.MakePopupRed();"> <h3>Some Notification!</h3> Testing 1234... </div>

：例えば

は、ここに私の新しいnotification.htmlですwindow.createPopupから作成されたポップアップ内で実行すると、ポップアップウィンドウ自体ではなく、親ウィンドウのコンテキストで実行されます。

出典

2012-04-17 18:37:16 RMD

あなたはそうです、直感的です。おめでとうございます。実際には、たとえばポップアップを抽象化する方が簡単です。 '$ nPopup'をコンテキストとして使用して、（必要に応じて）' var $ nPopup = $（ "notificationPopup.document"）;をJavaScriptからポップアップのイベントハンドラをアタッチする必要があります。 jsでハンドラをアタッチするのは、HTMLアプローチのPLUSよりも一般的に優れています。この場合、top.SourceFrameを使用する必要はありません。ポップアップ内のjsメンバーに対処するための表記法。 –

this referenceによると、window.createPopup()で "スクリプトはメソッドによって返されたポップアップオブジェクトにコンテンツ（外部URLではなく）を割り当てなければなりません"。

コンテンツに外部URLを割り当てたい場合は、非独自の（クロスブラウザ）方法window.open()を使用する必要があります。

window.open()では、メインウィンドウとポップアップウィンドウ間の通信は引き続き実行できます。

、その後、var myPopup = window.open(...);でオープンするポップアップを仮定：

メインウィンドウのアドレスのポップアップがmyPopup
としてポップアップがopener

出典

2012-04-16 20:12:20

外部URLを割り当てません。その外部URLからjQuery経由でコンテンツをロードし、そのコンテンツをポップアップウィンドウに割り当てます。 – RMD

はい、もちろん、私は今見ています。ドー！ –

ポップアップウィンドウ内の空のDOM

答えて

関連する問題