これは珍しい質問だと思います。いいえ、これはタイプミスではありません。
別ウィンドウで同じページを開こうとしています。そして、その新しいウィンドウで、クロス JavaScript 操作をしたいと思います。つまり、新しいウィンドウは古いウィンドウを操作でき、その逆も可能です。JavaScript (jQuery の場合もあります) から完全な DOM まで。さらに同期スクロール
どうもありがとう!
これは珍しい質問だと思います。いいえ、これはタイプミスではありません。
別ウィンドウで同じページを開こうとしています。そして、その新しいウィンドウで、クロス JavaScript 操作をしたいと思います。つまり、新しいウィンドウは古いウィンドウを操作でき、その逆も可能です。JavaScript (jQuery の場合もあります) から完全な DOM まで。さらに同期スクロール
どうもありがとう!
ここ:
// you use a regular window.open()
var w = window.open(window.location.href);
// the variable w now contains a reference to the newly opened window.
// from the newly opened window use window.opener :
window.opener.alert("Called in parent window.");
Ok。ついに、私のすべての頭痛に対する真の答えを見つけました。
同じページから親ウィンドウと子ウィンドウの間で通信するための最良の方法は何かを説明します。このロジックは、異なるページ (ただし、同じホストから) に対して微調整できます。
使用: JavaScript + PHP
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
<!--
var window_ = null;
var n = false; //Variable n
<?php
if(isset($_GET['n'])) //This will make the n variable go true if
//'?n' (without quotes) is found in the URL. Meaning, that the child exists
{
print('n = true;');
}
?>
function openChildWindow() //function which opens the child window.
{
if (window_ != null) //This will check if the window is opened
{
if ( window_.closed == false ) //if the window is opened, a.k.a is not closed
window_.close(); // close the window
window_ = null; // and nullify the variable, so it can be reopened if desired.
}
else
{
window_ = window.open(window.location.href+'?n'); //This is the tricky part.
/*Assign the window.location.href so it will open a new window with the same page
BUT assign it the n variable, so the GET function will receive it, and set n to true.
*/
window_.focus();
}
// Need to call on a delay to allow
// the child window to fully load...
}
function callChildWindowFunction()
{
if ( (window_ != null) && (window_.closed == false) )
{
window_.shout('bearl');
}
}
// -->
function shout(val)
{
alert(val);
}
$(document).ready(function(e) {
/*Wait for the document to load, so you can check if the variable n is true,
which means that **IT IS** the child window and it has been loaded completely. Meaning
that you can finally manipulate the child window with the parent document*/
if(n == true)
{
window.opener.callChildWindowFunction(); //Call the parent telling it "I'm ready"
}
});
</script>
<input type="button" value="Blear" onClick="openChildWindow();">
では、コードの説明です。
ここでの秘訣は、どのページが親でどのページが子であるかをブラウザーに伝える「人為的なスイッチ」を作成することです。
これを行うのは変数nです。偽の値を割り当てることで、ロードされたのは子ではなく親であることを伝えています。
子ウィンドウが開かれると (openChildWindow() 関数を参照してください)、状況に応じてウィンドウを閉じたり開いたりできるように、ウィンドウが開かれているかどうかを確認します。
ウィンドウが開かれると、EXACT URL と ?n 変数が割り当てられます。これは、PHP が子ウィンドウであることを識別するのに役立ちます。
開いたページの下部で、ドキュメントが読み込まれた後、n が true になるため、window.opener関数を介して親が呼び出されます。これにより、子の関数 (shout(val)) をトリガーする関数がトリガーされます。
2 つの異なるページでこれを行うこともできます。
ページ「A.html」とページ「B.html」を作成します (引用符なし)。
ページ A は次のコードを取得します。
<script type="text/javascript">
<!--
var window_ = null;
function openChildWindow()
{
if ( (window_ != null))
{
if ( window_.closed == false )
window_.close();
window_ = null;
}
var windowUrl = 'B.html';
window_ = window.open(windowUrl);
window_.focus();
}
function callChildWindowFunction()
{
if ( (window_ != null) && (window_.closed == false) )
{
window_.shout('bearl');
}
}
// -->
</script>
<input type="button" value="Blear" onClick="openChildWindow();">
ページBはこれを取得します
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
function shout(val)
{
alert(val);
}
$(document).ready(function(e) {
{
window.opener.callChildWindowFunction();
}
});
</script>
メカニズムは同じであることに注意してください。ページが異なるため、「人為的な切り替え」が必要ないという唯一のこと。
作成したいページ B を $(document).ready() 関数に割り当てて、完全にロードされたことを確認し、window.opener 関数を介して親を呼び出して、子の呼び出しを開始できるようにします。
これを行うためのより良い方法を見つけた場合は、先に進んで見せてください. setTimeOut、setInterval 関数は、タイムアウトになる前に事前に実行されたコード (Opera) が原因で機能しませんでした。さらに、これによりドキュメントが 100% 読み込まれたことが保証され、ユーザーのインターネット接続が遅い場合でもコードが壊れることはありません。