0

javascript と localstorage を使用して登録ページとログイン ページを作成する必要がありますが、いくつかの点で非常に混乱しています。

保存する必要があるすべての情報が文字列であるとしましょう。これらの文字列の配列をローカルに保存し、いつでも拡大でき、消去されない限り拡大し続けたいとします。後でその配列を解析し、その文字列をログイン ページに入力される文字列と比較できるようにする必要があります。ローカル ストレージに文字列の配列を作成してアクセスするにはどうすればよいですか? 私は次のことを試しました:localstorage.token = JSON.stringify(token);しかし、新しいトークンがあるたびに、それを再書き込みします。いくつかの投稿を読みましたが、まだ少し混乱しています。

ありがとうございました。

4

2 に答える 2

1

わかりました、まだ端が荒いですが、ここにいくつかの概念実証があります:

HTML:

<form>
    <input name='abc' value='' />
    <input name='def' value='' />
    <input name='ghi' value='' />
    <button type="button">Save</button>
</form>

JS:

$(function() {
    var $form = $('form'),
        $saveBtn = $('button'),
        myForm = {}, 
        myFormJsoned = localStorage.getItem('myform');

    if (myFormJsoned) {
        try {
            myForm = JSON.parse(myFormJsoned);
            $.each(myForm, function(i, obj) {
              $form[0][obj.name].value = obj.value;
            });
        }
        catch(e) {
            localStorage.removeItem('myform');
        }
    }
    $saveBtn.click(function() {
        localStorage.setItem('myform', 
            JSON.stringify($form.serializeArray()));
    });
});

ポイントは、このボタンがクリックされると、フォームがその補助的な jQuery メソッドを使用して配列にシリアル化されることです (もちろん、利用serialize可能であれば、使用はさらに簡単unserializeになります)。次に、JSON 化され、localStorage の 1 つのフィールドに格納されます。

ページをロードすると、プロセスが逆になります。JSON はオブジェクトの配列 (jQuery.serializeArray の結果) に解析され、この AoO は再びフォームに挿入されます (便利な を使用$.each)。

コンセプトは何ですか？私のポイントは、localStorage は cookie のような単一文字列のコンテナーであるため、確かに使用できるということです。しかし、ここでも、フィールドごとに個別のコンテナーを使用することを検討します。

localStorage.setItem('myform_abc', $form[0].abc.value);
localStorage.setItem('myform_def', $form[0].def.value);
localStorage.setItem('myform_ghi', $form[0].ghi.value);
于 2013-05-17T22:19:21.777 に答える