iFrameをバックボタン

は、次のHTMLを考えてみます（Google Chromeのために書かれた）iFrameをバックボタン

<html> 
    <head> 
    <script language="javascript"> 
     function AddToIFrame(){ 
     var Frame=document.getElementById("BackTest").contentWindow.document; 
     Frame.open(); 
     Frame.write(Math.random()); 
     Frame.close(); 
     } 
    </script> 
    </head> 
    <body> 
    <iframe id="BackTest" name="BackTest" width="100%" height="222"></iframe> 
    <a href="javascript:AddToIFrame();">Add To IFrame</a> 
    <p>How Can I Modify This HTML So That After Clicking The Link Above, I Can Use The Back Button To Go To Previous IFrame Content?</p> 
    </body> 
</html>

リンクをクリックするたびに、IFRAMEの内容が変更されます。これはうまくいく - と私の目的のためにiframeの内容を変更するdocument.writeを使用する必要があります。

私の問題は、iframeの以前の内容を元のページに戻したいということです。他の多くのページと同様です。この例では、前のメインページに戻るボタンがあります。

iframeの履歴がなくなるまで、戻るボタンでiframeが元に戻り、メインページから「戻る」だけになるようにするにはどうすればよいですか？

出典

2010-12-19 Joshua

「なぜdocument.writeを使用する必要がありますか」 – ephemient

レンダリングしたいHTMLを表すURLがないので、JavaScriptで動的にHTMLを動的に生成します。 – Joshua

生の 'document.write'よりはるかに優れたDOM操作テクニックがたくさんあります。とりわけ、ノードをコピーして保存し、移動したり削除したりすることができます。 – ephemient

新しいHTML5の機能がいくつかあります。

<html> 
    <head> 
    <script> 
     var inner; 
     window.addEventListener('load', function() { 
     inner = document.getElementById('inner').contentWindow; 
     inner.document.open(); 
     inner.document.write(
      "\x3cscript\x3e" + 
      "var contents = document.getElementById('contents');" + 
      "window.addEventListener('load', function() {" + 
       "contents = document.getElementById('contents');" + 
      "}, false);" + 
      "window.addEventListener('message', function(e) {" + 
       "history.pushState(e.data, '', '');" + 
       "contents.value = e.data;" + 
      "}, false);" + 
      "window.addEventListener('popstate', function(e) {" + 
       "contents.value = e.state;" + 
      "}, false);" + 
      "\x3c/script\x3e" + 
      '\x3ctextarea id="contents" readonly\x3e\x3c/textarea\x3e' 
     ); 
     inner.document.close(); 
     }, false); 
     function messageInner() { 
     inner.postMessage(Math.random(), '*'); 
     } 
    </script> 
    </head> 
    <body> 
    <iframe id="inner"></iframe> 
    <a href="#" onclick="messageInner(); return false">Clickety</a> 
    </body> 
</html>

document.writeは本当に使用しないでください。その内側のスクリプトで自分のページ（<iframe src="…">）をホストしてください。

出典

2010-12-19 21:39:29 ephemient

私はそれがあなたが探している答えではないことを知っていますが、私はこれがすべて可能であるとは思わない、バックボタンはブラウザで制御され、javascriptではない。

あなたは

window.location.href = 'http://www.youradress.com/yourpage?iframeurl=' + iframeurl;

を行うことができ、pageloadにあなたは、クエリ文字列

このようにURLではiframeをロードし、ユーザーがボタンをクリックしたときにあなたのコードを変更することができ、あなたは完全な取得しますページの読み込み、URLは履歴に残り、戻るボタンは必要に応じて機能します

出典

2010-12-19 21:40:41

の代わりにFrame.open('text/html', 'replace');を使用します。

出典

2012-06-01 21:26:12 Steffen

iFrameをバックボタン

答えて

関連する問題