楽天市場内でiframeから親ページのscrollToの値を取得
- 楽天市場内でiframeから親ページのscrollToの値を取得する方法について教えてください。
- 楽天市場のショップを構築している際に、iframeで読み込んだ子ページから親ページのスクロール量を取得したいです。
- 楽天市場内で親ページのスクロール量を取得する方法について教えてください。
- ベストアンサー
楽天市場内でiframeから親ページのscrollToの値を取得
よろしくお願い致します。 現在、楽天市場のショップを構築しています。 やりたいことは、iframeで読み込んだ子ページからJavascriptで 親ページ(楽天のシステムで生成されたページ)のスクロール量を取得するというものです。 楽天市場はDOCTYPE宣言なし(互換モード)ですので iframeで読み込む子ページもそれに合わせています。 iframeで読み込む子ページの記述は以下です。 window.onload = function(){ var st = window.parent.document.body.scrollTop; alert(st); } 自作の親HTMLと上記と同じ子ページでサンプルを作ったら 問題なく動作しました。 ただ、楽天市場の中で実行するとアラートのウィンドウすら開きません。 parentがうまく動かないのかなと思ったんですが、 テストで window.onload = function(){ var st = window.parent.frames.length; alert(st); } とすると楽天市場内でもアラートのウィンドウが開きフレームの数を表示してくれます。 parentの問題ではないのでしょうか？ 行き詰まってしまったので皆さんのお知恵を拝借させて下さい。 よろしくお願い致します。
- tak513
- お礼率42% (3/7)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
楽天ということなので、恐らく、 http://oshiete1.goo.ne.jp/qa4560033.html と同じ理由だと思います。 JavaScirpt で異なるドメインの document を参照しようとするとセキュリティに引っかかります。 少ない知識のなかでですが、代替策としては、サーバスクリプトなどを使わないと難しいと思います。 あるいは、楽天に申請して、自分の管理しているドメイン間だけ許可してもらうなど。
関連するQ&A
- iframeの中から親ページをスムーズスクロール
タイトルどおり、iframeの中から親ページをスムーズスクロールしたいと考えています。 ヘッダに <script> $(function() { var topBtn = $('#toTop'); topBtn.click(function () { parent.$('body,html').animate({ scrollTop: 0 }, 500); return false; }); }); </script> 親ページには高さ3000ピクセルのiframeを作って、そこに読み込んでいる子ページ最下部に <div id="gotoTop"><a href="#top_page"><img src="_image/btn_top.jpg" alt="トップに戻る" /></a></div> と記述しています。 この状態で親ページをスムーズスクロールさせることができません。 事情があって、親ページ側にはスクリプトやタグを追加することができません。 親も子もおなじドメインにあります。 ["parent" $('body,html') animate]などのキーワードで検索した記事を参考に parent.$('body,html').animate を window.parent.$("body").animate や $('html, body', window.parent.document).animate に書き換えてみてもうまくいきませんでした。 どうかアドバイスをお願いいたします。
- ベストアンサー
- JavaScript
- iframe子ページから親ページへのアクション
iframe内（子ページ）の<input>をクリックすると、 親ページのアクションとして<a href="#wrap">●●●</a>の 「●●●」を押したときと同じアクションをしてほしいのです。。 <input type="submit" onclick="(function(){ window.parent.※※※※※(); }());" /> ↑みたいな感じで実現できるのでしょうか？(T_T)
- ベストアンサー
- HTML
- iframeのソースを取得したい
いつもお世話になります。 物凄くまとめてしまってすみません。 window.onload = alert(document.getElementsByTagName("body")[0].getElementsByTagName("iframe")[0].contentWindow.document.innerHTML); というようなスクリプトを実行しているのですが、未定義（undifined）が表示されてしまいます。 もちろんbodyないにちゃんとしたsrcを指定したiframeはあります。 どのようにすればいいでしょうか。 よろしくお願いします。
- ベストアンサー
- JavaScript
- 単独で開かれたiframeを親ページに表示したい
ブログ記事(blog1.html、blog2.html、blog3.html)を親ページ(index.html)のiframeとして表示しています。 親ページを開いた際には、デフォルトで最も新しいブログblog3.htmlが表示されるようになっています。 ブログ記事が単独で開かれた場合には、 if (window == window.parent) { location.href = "./index.html"; により自動的に親ページに導くようにしていますが、その際に開かれたブログ記事を表示したいと思います。 当たり前ですが、現在はblog3が開かれてしまいます。 どのようにしたらいいでしょうか。 以下、現在確認中のサンプルスクリプトです。 ■親ページ■ <html lang="ja"> <head> <meta charset="UTF-8"> <title>index</title> </head> <body> <p>index.html</p> <iframe src="./blog3.html" frameborder="2" width="300" height="100"></iframe> <div id="result"></div> </body> </html> ■ブログ1■ <html lang="ja"> <head> <meta charset="UTF-8"> <title>blog1</title> </head> <body> <p>blog1.html</p> <script> // 単独で開かれている場合 if (window == window.parent) { location.href = "./index.html"; // iframeで開かれている場合 } else { } </script> </body> </html> ■ブログ3■ <html lang="ja"> <head> <meta charset="UTF-8"> <title>blog3</title> </head> <body> <p>blog3.html</p> <script> // 単独で開かれている場合 if (window == window.parent) { location.href = "./index.html"; // iframeで開かれている場合 } else { } </script> </body> </html>
- ベストアンサー
- JavaScript
- 親ページから子ページ内の操作をする iframe
インラインフレームを用いたサンプルを作っています。 親から子へ指示を送ったら、子がそれに応じるというものです。 ローカル環境でエラーを出さずに実現するには postMessageで、どんなコードになりますか？ 【親ページ】parent.html <body style="background:bisque"> <div>parent.html 親ページです.</div> <pre> 【テーマ】親ページから子ページ内の操作をする ＜条件＞ ・ローカル環境 ・親子とも同じ場所 ・親の指示で子が応じる </pre> <iframe id="iframe2" width="500" height="160" src="./child.html"> </iframe> <div>親からの指示内容</div> <div><button onclick="func1()">書き換え１</button> 「囲まれています」を「囲まれました」に書き換える</div> <div><button onclick="func2()">書き換え２</button> 「-----」を「親から伝言あり」に書き換える</div> <script> //子に指示する関数 function func1(){ } function func2(){ } </script> </body> 【子ページ】child.html <body style="background:#eee"> <div>child.html 子ページです.</div> <p> <span id="test">ここは「id属性がtest」のspan要素に囲まれています。</span> <div id="result">output:<span>-----</span></div> </p> <script> //子が応じる関数 </script> </body>
- ベストアンサー
- JavaScript
- Javascriptの関数について
Internet Explorer の右クリックメニューに登録するスクリプトを作っています。 たとえば、いま表示しているページのURLを表示する場合、 <script type="text/javascript"> var parentWindow = window.menuArguments; var URL = parentWindow.document.URL; window.onload = function() { kansuu(URL); }; kansuu = function(url) { alert(url); } </script> ↑は動きます。 また、 var parentWindow = window.menuArguments; var URL = parentWindow.document.URL; window.onload = kansuu(URL); function kansuu(url) { alert(url); } ↑も動きます。 ところが、 var parentWindow = window.menuArguments; var URL = parentWindow.document.URL; window.onload = kansuu(URL); kansuu = function(url) { alert(url); } は動きません。 なぜでしょうか？ 理由を教えていただけると嬉しいです。 よろしくお願いします。
- ベストアンサー
- JavaScript
- インラインフレーム内の変数を親ページから呼び出す
インラインフレーム内のマウス位置を↓のjavascriptコードで取得しているのですが、親ページのjavascriptの関数で使用したいです。どのようにインラインフレーム内の変数を親ページから呼び出して、利用すればよいのでしょうか？ var x, y; window.addEventListener("DOMContentLoaded", function(){ window.document.onmousemove = function(e){ x = getMousePosition(e).x; } },false); function getMousePosition(e) { var obj = new Object(); if(e) { obj.x = e.pageX; obj.y = e.pageY; } else { obj.x = event.x + document.body.scrollLeft; obj.y = event.y + document.body.scrollTop; } return obj; }
- 締切済み
- JavaScript
- innerHTMLに代入したインラインフレームのＤＩＶの値の取得について
下記のソースは「読み込み」ボタンを押した時にあらかじめ用意してた<div id="box">にインラインフレームを代入し、「値取得」ボタンを押したら、'sample.html'内のdivの値「keisan」をアラートで表示する記述です。このソース内容を、ボタンのイベントで「keisan」の値を取得するのではなく、<body>のonLoadでページを開いた瞬間にアラートが 出るようにしたいのですが、お分かりになる方はいらっしゃいますでしょうか？ わかりにくい説明ですみません。どうかよろしくお願いします。 <html> <head></head> <body> <div id="box"></div> <input type="button" value="読み込み" onClick="Details.changeURL('sample.html')" /> <input type="button" value="値取得" onClick="Details.showMessage('keisan')" /> </body> <script type="text/javascript"> <!-- var Details = (function(){ var handle = document.getElementById('box'); var buffer = null; return { changeURL: function(url){ handle.innerHTML = "<iframe src=\""+url+"\" id=\"ifr\"></iframe>"; }, showMessage: function(id){ buffer = document.getElementById('ifr').contentWindow.document; alert(buffer.getElementById(id).innerHTML); } } })(); //--> </script> </html>
- 締切済み
- JavaScript
- iframeのBgColorに親のColorを継承したい
iframeでフレームを作っていますが、バックグラウンドカラーがうまく表示されません。 NetscapeやFireFoxでは親の(tableなんですけど)から継承されているのですが... IE6では、真っ白です。 そこで、 var IFR = document.getElementById(id); IFR.contentWindow.document.bgColor='#cccccc'; 親(table)と同じ色にして対応していました。 これで、問題なく動いていたのですが、今回親(table)の色を可変にしなくてはならなくなりました。 これは、親から持ってくればいいのでは？と思ったので、 IFR.contentWindow.document.bgColor=parent.frames[id].bgColor; としてみたのですが、これはどうも親フレームの色のようで、 iframeを表示しているtableの色ではありませんでした。 うまくできません... iframeを表示している箇所（親）の色をiframeに設定（継承）する方法はないでしょうか？ 何色で表示するか、条件で変わってしまうので、スタイルシートは使いたくないのですが。 javascriptで設定する方法をご存知の方はいらっしゃいませんでしょうか？ よろしくお願いいたします。
- 締切済み
- JavaScript
- iframe内からjQueryで指定したい
jQueryのparentで親要素のIDを収得したいのですが、iframe内から、 読み込み元のHTMLを.parent()で追っていくと、取得できません。 jQuery("div#main iframe").contents().find('body').click(function(){ var hoge = jQuery(this).parent().parent().attr("id"); alert(hoge); }); .parent()では読み込み元のHTMLをまでいけないようなんですが、jQueryでは取得できないのでしょうか。 他にiframeから親を取得する記述があるのでしょうか。 アドバイスいただけると助かります。 拙い説明で恐縮ですが、どうぞよろしくお願いします。 こちら↓の板が閉鎖されるのを知らずにポストしていまい、 http://www.tagindex.com/cgi-lib/q4bbs/patio.cgi 解決の見込みがなさそうですで、改めてこちらでお尋ねしています。 ややマルチ気味で恐縮ですが、ご容赦ください。
- ベストアンサー
- JavaScript
お礼
アドバイスありがとうございます！ たしかによく見ると別ドメインでした。。。 できない理由がわかっただけでも非常に勉強になりました！ ありがとうございましたm(_ _)m