IE11で入力フォームの値がhistory.backで消える不具合に関して

以前から、IE(インターネットエクスプローラー)で入力フォームの値が、正しくキャッシュされず、history.backやブラウザの戻るボタンで消える問題が良く取り上げられており、解決策として、

<meta content="86400" http-equiv="Expires"/>

のように、ページの有効期限を指定する方法が紹介されていましたが、


IE11環境で下記条件の画面遷移を行うと、有効期限を指定していても消える現象に悩んでいました。
[1]入力フォームで値を入力しsubmitボタンを押す
[2]確認画面で、戻る(hitory.back)ボタンを押す
[3]入力フォーム[この時は全ての項目が正しく表示]で再びsubmitボタンを押す
[4]確認画面で、戻る(hitory.back)ボタンを再び押す
[5]入力フォームが表示されるが、textタイプのinput項目の値が表示されない(※2回目の入力フォーム表示時に、再度、値を入力した項目に関しては、textタイプの項目でも値を維持しています)
の現象になやまされていました。

プログラム的にも、素直に、history.backを使用せず、プログラムで値を表示すれば良い事はわかっていますが 解決方法が無いのか気になっていましたが、最近解決方法がわかりました。(根本的な解決法では無いですが)



<input type="text" name="txt1" value="" />

と入力フォームを記載している場合は、上記の画面遷移をした場合、入力フォームの値が消えてしまいます。
しかし、

<input type="text" name="txt1" />

とvalue属性の記述をなくすと、何度、入力フォームと確認フォームを何回行き来しても消えなくなりました。
この挙動は、仕様とは思えず、不具合と思うのですが、どうなんでしょう?

同じように悩んでいる方がいましたら、お確かめください。





※追記 internet explorer – The value of input (text / hidden) empty in IE 11 (Edge), "back" or history.back () for second time – Stack OverflowIE11ブラウザでのhistory.back()について – QA@IT などでも、同様の現象に関して記載しており、 基本的には、javascriptによって、強制的に値を再設定して、回避しているようです。
jquery版

$(document).ready(function () {
        $("input[type=text]").each(function () {
            $(this).val($(this).val());
        });
    });

引用:internet explorer – The value of input (text / hidden) empty in IE 11 (Edge), "back" or history.back () for second time – Stack Overflow



jquery未使用版(addEventListenerを使用している為、IE8以降)

window.addEventListener("load", function() {
    var elms = document.getElementsByTagName("input");
    for (var i = 0; i < elms.length; i++) {
        var elm = elms[i];
        var elmType = elm.type.toLowerCase();
        if (elmType === "text" || elmType === "hidden"){
            elm.value = elm.value;
        }
    }
}, false);

引用:internet explorer – The value of input (text / hidden) empty in IE 11 (Edge), "back" or history.back () for second time – Stack Overflow

のりべーす

インスタグラム

Instagram ビール用
Instagram 日本酒用



個人情報保護方針お問い合わせ