詳しい人求む！

Chromeがiframe内の「#～」に釣られてしまうのは仕様ですか？

締切済

質問者：いしい
質問日時：2021/05/06 22:01
回答数：1件

次のようなソースのファイルを作ってChromeで表示してみたらページの先頭からではなくiframeの所から表示されてしまいました。
ページを表示した後、先頭までスクロールしてからリロードすれば先頭から表示されるのですが、ソースにある「このページへのリンク」などリンクをクリックして表示した場合は先頭ではなくiframeの所から表示されます。
これはChromeのバグでしょうか？仕様でしょうか？
仕様だとしたら、どうしてこのような仕様になったか、ご存知の方がいらっしゃいましたら教えてください。

test1.html
http://hitorinezumi.html.xdomain.jp/test1.html
↓
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Chromeのiframeのバグ？</title>
</head>
<body>
<div style="height:200px;">
バナー、ヘッダなど。
</div>
<div style="height:250px;">
<h4>↓↓↓iframe↓↓↓</h4>
<iframe src="test0.html" id="test0" title="test0"></iframe>
</div>
<div style="height:1000px;">
<a href="test1.html">このページへのリンク</a>
</div>
</body>
</html>

test0.html
↓
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>iframe内</title>
</head>
<body>
<p>iframe内</p>
<script type="text/javascript">

</script>
</body>
</html>

ちなみに、次のようなページもありました。

【珍現象】iframeのsrcに”#”を指定すると
https://www.softel.co.jp/blogs/tech/archives/2780

そのページは2011/11/12に書かれたものらしいです。
その時から変わってないのかもしれません。
私が気付いたのは今年でした。

補足日時：2021/05/06 22:36
通報する
ちなみに、私は普段はFirefoxを使っていて、Firefoxでは生じません。
だから気付くのが遅れたのですが…。

補足日時：2021/05/06 22:41
通報する
ちなみに、質問で「先頭からではなくiframeの所から表示され」るのはtest1.htmlのことです。
http://hitorinezumi.html.xdomain.jp/test1.html

test0.htmlには「id="top"」がありませんが「#top」は機能するようです。「#frg」など適当な文字列では無視されてtest1.htmlに影響を与えません。
test0.htmlに「id="frg"」がある場合は、test0.htmlで「#frg」を使って途中から表示させると、test1.htmlはiframeの所から表示されてしまいます。

補足日時：2021/05/06 22:53
通報する
ご自身のサーバーで再現する際の注意事項が増えました。
質問のソースでtest1.htmlとtest0.htmlは同じサーバー内にありますが、
test0.htmlが別のサーバーにある場合だと、質問のような現象は起こらないことを確認しました。
http://hitorinezumi.html.xdomain.jp/test2.html

また、質問のソースではiframeのsrcが相対パスになっていますが、絶対パスに変えても変わりませんでしたので、質問のようなことが生じないようにするには、iframeのsrcを絶対パスで書けば良いのではなくて、iframeで表示するページを別のサーバーに置けば良いようです。しかし、それは現実的な対策ではないので、同じサーバーのファイルを表示する場合でも質問のようなトラブルが起こらないようにしたいと思っています。

補足日時：2021/05/07 16:05
通報する

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

最新から表示
回答順に表示

No.1

回答者： ma0306
回答日時：2021/05/06 22:13

javascriptでurlパラメタにシャープ(#)を含む文字列を渡した場合、#以下は無視されてしまうそうなので、encodeURIComponentなどを使うと良いそうですが参考になりますでしょうか？

ソース
http://affi0.blog61.fc2.com/blog-entry-1203.html

- 0
- 件

通報する

この回答へのお礼

ご回答、ありがとうございます。
たぶん関係ないと思います。
例えば、
test1.htmlで
<iframe src="test0.html#top" id="test0" title="test0"></iframe>
と書いても同じ現象が生じます。
そう書くとsrcに「#～」があるから生じる問題のように見えちゃうので、質問のようにしました。Javascriptのせいではないと思います。
iframeの中のページを「#～」までスクロールさせる他の方法が分からなかったのでJavascriptを使いましたが…。

通報する

お礼日時：2021/05/06 22:36

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！