2012-02-28 4 views
0

私は、ポップアップウィンドウに、その親ウィンドウに、その親に対して利用可能なデータがあることを通知しようとしています。私が使用しているメカニズムはdataavailableイベントです - ポップアップはそれを作成して親に送ります。親はそのようなイベントをリッスンし、イベントが発生すると親のイベントハンドラが呼び出されます。データ利用可能なイベントは、ポップアップからJavascriptの親ウィンドウにデータを送信するにはどうすればよいですか?

問題は、実際にイベントの一部のデータを渡そうとしていることです。データは親に到達していません。ここで

は、親のためのソースコード、テストparent.htmlです:

<html> 
<head> 
<title>Test parent</title> 
<script type="text/javascript"> 
function openPopup() 
{ 
    window.open("test-popup.html", "popup", ['width=400', 'height=200']); 
    window.addEventListener("dataavailable", onDataAvailableEvent, false); 
} 

function onDataAvailableEvent(event) 
{ 
    alert("In onDataAvailableEvent(), " + 
      "event.timeStamp '" + event.timeStamp + 
      "', event.eventType '" + event.eventType + "'"); 
} 
</script> 
</head> 

<body> 
<input type="button" value="Open test-popup.html" onclick="openPopup()" /> 
</body> 
</html> 

そして、ここでポップアップのソースコード、テストpopup.htmlです:

<html> 
<head> 
<title>Test popup</title> 
<script type="text/javascript"> 
function onButtonClick() 
{ 
    var syntheticEvent = document.createEvent("Events"); 
    syntheticEvent.initEvent("dataavailable", true, false); 
    syntheticEvent.eventType = "test-popup.html finished"; 
    window.opener.dispatchEvent(syntheticEvent); 

    alert("Dispatched dataavailable event, " + 
      "syntheticEvent.timeStamp '" + syntheticEvent.timeStamp + 
      "', syntheticEvent.eventType '" + syntheticEvent.eventType + "'""); 
} 
</script> 
</head> 

<body> 
<input type="button" value="Create dataavailable event" onclick="onButtonClick()" /> 
</body> 
</html> 

試験 - は、 parent.htmlとtest-popup.htmlは両方とも警告メッセージを出します。両方のアラートメッセージのタイムスタンプは一致しているので、ポップアップによって作成されたイベントが親によって受信されていることはかなり確信しています。ポップアップにはsyntheticEvent.eventTypeの正しい値が表示されますが、親のevent.eventTypeは未定義です。

私がWeb上で見つけた例は、データをdataavailableイベントに入れて交換できることを示しています。 私は何が間違っていますか?

ご回答いただきありがとうございます。

答えて

0

次にあなたがdataavailable

あるアラートで正しいイベントタイプを取得します... テストparent.htmlevent.type

function onDataAvailableEvent(event) 
{ 
    alert("In onDataAvailableEvent(), " + 
      "event.timeStamp '" + event.timeStamp + 
      "', event.eventType '" + event.type + "'"); 
} 

event.eventTypeを変更してください。

関連する問題