人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

localstrageで保存した情報が、Opera、Chromではgetできるのに、Firefox3.6以降、IE8以降ではget出来ず、NULLになってしまいます。

以下スクリプト
<form method="post">
<textarea id="main_txt" cols="80" rows="30"></textarea>
<input type="submit" value="送信"/>
</form>
<input type="button" value="削除" id="del"/>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>

<script type="text/javascript">
window.onload = function() {
// メモの読み込み
var body = localStorage.getItem("memo");//strageに保存されたメモ
var date_time = localStorage.getItem("date_time");//strageに保存された日時
if (body != null) {
$('#main_txt').val(body);
$('#msg_div').text(date_time);

}
};

//削除ボタンを押したらストレージ削除
$("#del").click(function () {
localStorage.clear();
window.location.reload();
});

//送信ボタンを押したら、ストレージを保存
$("form").submit(function() {
localStorage.setItem("memo", $('#main_txt').val());
localStorage.setItem("date_time", new Date());//保存日時
});

</script>

●質問者: goodbabies
●カテゴリ:コンピュータ ウェブ制作
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● a-kuma3
●34ポイント

HTML5 の仕様では、localStorage にオブジェクトを突っ込めることになってますが、文字列しか保存できない実装が多いようです。


明示的に文字列として保存してみたらどうでしょうか?

 localStorage.setItem("date_time", (new Date()).toString()); //保存日時
◎質問者からの返答

確かに、文字列しか入れないですね。

なるほど、全て文字列に変換してからつっ込めばいいかもしれないですね。


2 ● Cherenkov
●33ポイント

$(function(){

//この中で$を使うべきです。

});


個人的にはtoString()よりもJSONのほうが好きです。

localStorage.setItem("date_time", Date.now()); //now()はstring型
console.log(Date(localStorage.getItem("date_time"))) //Dateオブジェクトに戻す


3 ● a-kuma3
●33ポイント ベストアンサー

「localStorage からの getItem() が null を返す」、というところだけに絞って書きます。


質問のコード、ほぼ、そのままの以下のコードを、ローカルの LAN にたててある apache で試してみました。

<html>
<body>

<form method="post">
<textarea id="main_txt" cols="80" rows="10"></textarea>
<input type="submit" value="送信"/>
</form>
<input type="button" value="削除" id="del"/>


<p>
msg_div: <span id="msg_div"></span>


<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>


<script type="text/javascript">
window.onload = function() {
 // メモの読み込み
 var body = localStorage.getItem("memo"); //strageに保存されたメモ
 var date_time = localStorage.getItem("date_time"); //strageに保存された日時
 if (body != null) {
 $('#main_txt').val(body);
 $('#msg_div').text(date_time);
 }
 };

//削除ボタンを押したらストレージ削除
$("#del").click(function () {
 localStorage.clear();
 window.location.reload();
});

//送信ボタンを押したら、ストレージを保存
$("form").submit(function() {
 localStorage.setItem("memo", $('#main_txt').val());
 localStorage.setItem("date_time", (new Date()).toString()); //保存日時
});
</script>

</body>
</html>

FF5.0 と、FF3.6.23 で試してみたんですが、ちゃんと setItem() で保存したデータを、

getItem() で取得できるんですよね。


質問にあげたコードは、何かのコードから抜粋したものだと思うのですが、

抜粋した部分以外に問題がある、ということは考えられませんか?

◎質問者からの返答

ありがとうございます。勘違いしていまして、ローカル環境ではなく、サーバーに置いたところ、動作することが確認できました。

Operaはローカルでも動きますが、FFはローカルでは動かないようでした。勉強不足ですね、ありがとうございました。

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ