ブラウザバックするとchromeでjavascript(Jquery)が動かない

Question

フォームに名前が入力されているときは背景を白くするコードがありますが、ブラウザバックしたときにdocument.getElementById('name').valueがフォームの値を読み取ってくれないため白くなりません。どのようにすればよろしいでしょうか。

$(function(){
var name = document.getElementById('name').value;
if(name == ""){}else{
document.getElementById('name').style.backgroundColor = '#FFF';
}
});

白くならない
chrome(PC),chrome(android),
白くなる
ie11(PC)、safari,chrome(ios)

var name = document.getElementById('name').value;
if(name == ""){}else{
document.getElementById('name').style.backgroundColor = '#FFF';
}

白くならない
chrome,ie11(PC)、chrome(android)
白くなる
safari,chrome(ios)

Answer 1

戻ってきたときの挙動はブラウザ依存です
history.backされたときreloadしてみては？

var flg_load=window.performance.navigation.type;
$(window).on('pageshow', function(){
  if(flg_load==2) location.reload();
  flg_load=2;
});

Comments

[yambejp]

firefox以外はreloadするとデータが消えるものが多いようです

Answer 2

$(window).on("load",function(){});

で囲んだら解決しました。お手数をおかけしました。

Answer 3

ブラウザバックの挙動はブラウザで一律にはなっていないので、「そこは動作保証しない」のが最も現実的な選択肢です。