Q&A
「labelAの項目」とはなんですか？ また、「項目リスト」とはなんですか？
teratailへの質問は、ソース等を記載しなくてはいけないようですが、長すぎて記載できないのでそのでも教えていただける方教えてください。
htmlとcssでレシポンシブなHPを作成し動作確認をしたのですがどうしてもうまくいかないことが１点ります。
index.htmlの画面の一部にtab画面を作成、tab画面は左からA、B、C、Dのlabelを4つ配置し初期はlabelAの項目が表示されている状態にしています。
Edgeを起動しA、B、C、Dのlabelをクリックすれば個々A、B、C、Dの項目リストに画面が変わりリンク先へ移動しました。
わからないのは一端リンク先に移動し再びindex.htmlに戻るとlabelB、C、Dのlabelは表示していますがB、C、Dの項目リストは消えてしまいます。消えたB、C、Dの項目リストの状態でlabelB、C、Dのlabelをクリックすれば再びB、C、Dの項目リストは表示します。何回やっても同じです。
Edgeを終了させて、再度起動させると再びちゃんと表示しますが、現象は上記のままです。
ネットに掲載してあるtabのソースを2種類試してもダメでした。
スマホ、Pad、ファイアーフォックス、グーグルクロモ、IEではリンク先から戻ってもlabelB、C、DとB、C、Dの項目のリスト表示は問題ないのですが何故かEdgeだけダメです。
この現象の改善方法どなたかわかる方教えてください。
よろしくお願いします。
『長くて記載できない』
タブ部分だけで100行とか書いてるわけではないですよね？
該当部分を抽出すれば記載できるはずです。
文章だけだとイメージするしかないのですごく回答しにくいですし、的確なものは得られないと思います。
工夫して質問しましょう
『Edgeを終了させて、再度起動させると再びちゃんと表示します』とのことですが、この「ちゃんと表示」とは、具体的にはどういう状態ですか？
ソースを表示できなくてほんと申し訳ありません。
Edgeを起動させると、index.html画面のtab画面のlabelA、B、C、Dの表示とA、B、C、Dのlabelをクリックすれば個々A、B、C、Dの項目リストに画面が変わります。
例えば、labelBをクリックすると、Bの項目リストを表示しクリックすればリンク先へは移動します。
しかし、Edge左上の戻るボタン「←」でindex画面に戻ると本来ならBの項目リストを表示していないといけないのに空白になってしまいます。labelA、B、C、Dは表示しています。
labelC、Dでも同じようになってしまいます。ただし、labelAだけは「戻る」ボタンを押しても問題なく表示動作します。
labelB、C、Dだけは、１回リンク先へ移動し再び「戻る」ボタンを押すと項目リストは消えています。この状態で再びlabelB、C、Dをクリックすると項目リストは再表示します。
ソースが合わないかと思い、別のソースを見つけて再度行っても同じ状態になっています。質問にも書いたようにスマホ、Pad、ファイアーフォックス、グーグルクロモ、IEでは問題ありません。
回答1件
0
ベストアンサー
当方で試したところ、Edgeだけではなく、Chromeでも同様の振る舞いでした。
おそらくバックフォワード時のキャッシュの問題かと思いますので、戻った時にBの項目リストが表示されることを期待しない方がいいのではないでしょうか。
投稿2019/12/24 07:36
総合スコア36134
ソースのない状態で回答していただきありがとうございました。私の場合はEdgeだけ発生します。改善方法がないのが残念です。
BF時のブラウザキャッシュを期待するのではなくて、きちんと「Bの項目リストを表示」するようなスクリプトを書いておくべき、ということです。
期待している改善方法ではないと思いますが、そうすればすべてのブラウザで同様の振る舞いになるはずです。
連絡遅くなりました。また、ご親切にありがとうございます。あまり知識のないに私にはよくわかりせんが、tabはCSSとhtmlのみで作成してあるソースをindex.htmlに組み込んでいます。そのindex.htmlにはjsやscriptがありますが、そっちの問題問ことでしょうか？
問題というか、未実装、ということだと思います。
大変参考になりました。数回にわたりありがとうございました。私の力では処置不可です。貴重なお時間を頂き感謝いたします。
あなたの回答
tips
プレビュー
