1

問題は、ブラウザーを閉じて再度テストすると値が表示されることですが、ページを更新すると、以前に選択した値がユーザーに表示されませんが、localStorage にはデータが保存されています。

<form id="suspendedProperties">
        <label for="stationDropdown">Select Station:</label>
        <select name="stationDropdown" id="stationDropdown" onChange="storeLocalContent(this.id,this.value)" >
            <option value="50028000">Tanama River</option>
            <option value="50010500">Rio Guajataca, Lares</option>
            <option value="60008002">Example River2</option>
            <option value="60008003">Example River3</option>
            <option value="60008004">Example River4</option>
         </select>


        <label for="sampleMediumDropdown">Select Sample Medium:</label>
            <select name="sampleMediumDropdown" id="sampleMediumDropdown" onChange="storeLocalContent(this.id,this.value)">
              <option value="WS">WS(Surface Water)</option>
              <option value="WSQ">WSQ(Surface Water QC)</option>
            </select>

        <label for="date">Begin Date:</label>
            <input naem="date" id="beginDate" type="date" onChange="storeLocalContent(this.id,this.value)" />

         <label for="hydroEvent">Hydrologic Event:</label> <select name="hydroEvent" id="hydroEvent" onChange="storeLocalContent(this.id,this.value)" >
                                <option value="4">4- stable, low stage</option>
                                <option value="5">5- falling stage</option>
                                <option value="6">6- stable, high stage</option>
                                <option value="7">7- peakstage</option>
                                <option value="8">8- rising state</option>
                                <option value="9" selected>9- stable, normal stage</option>
                                <option value="A">A- Not Determined</option>
                                <option value="X">X- Not applicable</option>  
                              </select>

    <label for="containerCuantity">Add: </label><input type="number" min="1" value="1" id="containerCuantity"onChange="storeLocalContent(this.id,this.value)"/> 
    <select id="singleMultiContainer"name="singleMultiContainer" onChange="storeLocalContent(this.id,this.value)">
                                            <option value="single">Single container sample</option>
                                            <option value="multi">Multiple sets container</option>
                                           </select>

    <h4 >Analyses Requested:(Applies to all samples)</h4>

      <label for="analysesC">Concentration</label><input type="checkbox" name="analysis" id="analysesC" value="C" onChange="isChecked(this.id,this.value)"/>
      <label for="analysesSF">Sand-Fine break**</label><input type="checkbox" name="analysis" id="analysesSF" value="SF"onChange="isChecked(this.id,this.value)"/>
      <label for="analysesSA">Sand Analysis**</label><input type="checkbox" name="analysis" id="analysesSA"value="SA" onChange="isChecked(this.id,this.value)"/>
    <label for="analysesT">Turbidity</label><input type="checkbox" name="analysis" id="analysesT" value="T" onChange="isChecked(this.id,this.value)"/>
     <label for="analysesLOI">Loss-on-ignition**</label><input type="checkbox" name="analysis" id="analysesLOI" value="LOI" onChange="isChecked(this.id,this.value)"/>
     <label for="analysesDS">Dissolved Solids</label><input type="checkbox" name="analysis" id="analysesDS"value="DS" onChange="isChecked(this.id,this.value)"/>
     <label for="analysesSC">Specific Conductance</label> <input type="checkbox" name="analysis" id="analysesSC" value="SC" onChange="isChecked(this.id,this.value)"/>                                  
     <label for="analysesZ">Full-size fractions**</label><input type="checkbox" name="analysis" id="analysesZ"value="Z" on onChange="isChecked(this.id,this.value)"/>


    </form>

これは私の localStrg.js です:

var ls = window.localStorage;

function initialize(){
    //Check if browser supports localStorage
    if(!Modernizr.localstorage){
        alert("Your browser will not store data, please change or update your current browser");
        return false;
        }

    if(ls.length!= 0){
        for(i=0;i<ls.length;i++){
            getData(ls.key(i));
            alert(ls.key(i));
        }
    }
}
function storeData(id,value){
    ls.setItem('#'+id,value);
    alert("Item saved"+' '+'#'+id);
}

function getData(id){
    $(id).val(ls.getItem(id));
    $(id).selectmenu('refresh');
}

$(document).ready(function(e) {
    initialize();
});

私がやりたいことは、それぞれのフィールドで以前に選択した値をユーザーに表示することだけです。

たとえば、ドロップダウンでオプション 4 を選択し、ページを更新すると、ドロップダウンにはオプション 1 ではなくオプション 4 が既に表示されているはずです。

4

1 に答える 1

1

コードは問題ありません。間違いは、JQuery Mobile を初期化するときです。

<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.3.2.min.js" type="text/javascript"></script>
<script src="localStorage.js"></script>

これにより、JQuery からすべてのデフォルト値が得られ、localStorage から値が読み込まれます。私がしなければならなかったのは、localStorage.jsjquery mobile を初期化する前に のスクリプトを変更することだけでした。

<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="localStorage.js"></script>
<script src="jquery-mobile/jquery.mobile-1.3.2.min.js" type="text/javascript"></script>

詳しい説明はこちら

于 2013-08-19T13:20:31.387 に答える