HTML 5ストレージ-LocalStorageとセッションStroage

4171 ワード


 
ここ数日組織部に入ったほうがいいので、収穫も大きいです.以前のページの値の伝達の方面は自分で比較的にあいまいで、この間の項目を通じて
目の中の鍛錬、これに対して少し理解しました!
プロジェクトを行う場合、ページの値を渡すには一般的に2つの方法があります.
1、formフォームを提出し、URLで値を伝える.
例:
JSでformフォームを提出し、年を渡す
<span style="font-family:Comic Sans MS;font-size:18px;">functionCadresQualitativeTarget() {
    CheckYear =document.getElementById("year").value;
    $('#dg').datagrid({
        url:"/CalculateScoreFrame/CadresCheckQualitativeTarget?checkyear=" +CheckYear,
        columns: [[
        { field: 'QualitativeTargetName',title: '    ', width: 400 },
        { field: 'conditioninput', title:'      ', width: 100 },
        { field: 'calculateinput', title:'    ', width: 100 },
        { field: 'operate', title: '  ', width:100 }
        ]]
    })
}
 </span>

コントロール受信値
  
<span style="font-family:Comic Sans MS;font-size:18px;">public JsonResultCadresCheckQualitativeTarget()
        {
            //         
            string CheckYear1 =Request["checkyear"];
            int CheckYear2 =int.Parse(CheckYear1);
 
            //             
            List<CalculateScoreViewModel>QualitativeTargetVM = iSetQualitativeTarge.CheckQualitativeTarget(CheckYear2);
 
            //               
            List<CalculateScoreViewModel>CadresQualitativeTargetVM = QualitativeTargetVM.Where(s => s.BasicinfoType== "  ").ToList();
 
            //        
            returnJson(CadresQualitativeTargetVM, JsonRequestBehavior.AllowGet);
        }</span>

 
2、ajaxを利用して値を伝える
例:
<span style="font-family:Comic Sans MS;font-size:18px;">functionDevelopmentQuanlityTarget()
{
    CheckYear =document.getElementById("DevelopYearTime").value;
   $.post('/SetAllWeightTarget/CheckDevelopmentQueryTarget?checkyear=' +CheckYear, function (data) {
     
       $("#txtDevelopmentWeight").val(data[0].AllWeight);
     
    });
}</span>

コントロールで値を取得
   
<span style="font-family:Comic Sans MS;font-size:18px;">public JsonResultCheckDevelopmentQueryTarget(int CheckYear)
        {
            string CheckYear1 =Request["checkyear"];
            int CheckYear2 =int.Parse(CheckYear1);
 
            List<CalculateScoreViewModel>CheckDevelopmentQueryTargetVM =iSetDevelopmentQuantifyTarget.CheckDevelopmentQueryTarget(CheckYear);
 
            returnJson(CheckDevelopmentQueryTargetVM, JsonRequestBehavior.AllowGet);
        }
    </span>

得点を計算する機能をするときはこれが必要で、1つのボタンをクリックするときは別のページに移動し、2つの値を渡す必要があります.いろいろな原因で、上の2つの方法は特に便利ではありませんので、他の方法があるかどうかを考えています.ほほほ、苍天は心を持っていません.私に新しい大陸を発見させて、ここでみんなに分かち合います!
           
まず、本システムの使い方を見てみましょう.
最初のページの割り当て:sessionStorage.a=「県市区定量」;
2ページ目の値:var objecttype=sessionStorage["a"];
 
 
説明:
html 5のWebStorageには、sessionStorageとlocalStorageの2つのストレージ方式が含まれています.sessionStorageは、同じセッション内のページにのみアクセスでき、セッションが終了するとデータも破棄されるセッション内のデータをローカルに格納するために使用されます.したがって、sessionStorageは永続的なローカルストレージではなく、セッションレベルのストレージにすぎません.一方、localStorageは、データをアクティブに削除しない限り、永続化されたローカルストレージに使用されます.データは期限切れになりません.
           
localStorageの簡単な使い方(sessionStorageと類似):
 
データを格納する方法はwindowに直接与えることです.localStorageは、windowなどのプロパティを追加します.localStorage.aまたはwindow.localStorage["a"].読み取り、書き込み、削除の操作方法は簡単で、キー値のペアで存在します.以下のようにします.
localStorage.a =3;//aを「3」に設定
localStorage["a"]= "sfsf";//aを「sfsf」に設定し、上の値を上書きします.
localStorage.setItem("b","isaac");//bを「isaac」に設定
var a1 =localStorage["a"];//aの値を取得
var a2 =localStorage.a;//aの値を取得
var b =localStorage.getItem("b");//bの値を取得
localStorage.removeItem("c");//cの値をクリア
 
2つの比較的良い文章のリンク:
HTML 5 LocalStorageローカルストレージとセッションストレージの使用
HTML 5の格納方法sessionStorageとlocalStorageの詳細
 
まとめ:困難はいつも成長と伴う!解決の困難が多ければ多いほど、成長が速くなります.