<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" />
この挙動は、仕様とは思えず、不具合と思うのですが、どうなんでしょう?
同じように悩んでいる方がいましたら、お確かめください。
※追記 internet explorer – The value of input (text / hidden) empty in IE 11 (Edge), "back" or history.back () for second time – Stack Overflow や IE11ブラウザでのhistory.back()について – QA@IT などでも、同様の現象に関して記載しており、 基本的には、javascriptによって、強制的に値を再設定して、回避しているようです。
jquery版
$(document).ready(function () {
$("input[type=text]").each(function () {
$(this).val($(this).val());
});
});
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);