如何在window.location之後存儲數據？

下面我有一個車輛下拉菜單，它將從文本文件中提取新的選項。在頁面切換到正確的分類頁面後，我還沒有找到一種方法來保存這些選定的TEXT值。所以最終我將下拉菜單改爲了一個將顯示所選下拉菜單的div。如何在window.location之後存儲數據？

那麼，如何既..

A.保持頁面重新加載後的下拉值和文本值。

B.保持選定的文本和適當的div顯示

任何幫助，非常感謝！

HTML：

<div id="shop_vehicle_container"> 
    <div id="shop_vehicle"> 
     <div id="bl_firstRow">      
        <div id="vehic_sel"> 
        <div class="sel_label"> 
        <div class="sel_label"> 
         Shop By Vehicle: 
        </div> 
       </div> 
       <div class="sel_container"> 
        <select id="vehic_sel_model"> 
         <option value="">Choose Model</option> 
         <option value="17Prelude">Prelude</option> 
         <option value="21Civic">Civic</option> 
         <option value="22CRX">CRX</option> 
         <option value="23CivicdelSol">Civic del Sol</option> 
         <option value="18Accord">Accord</option> 
         <option value="20Odyssey">Odyssey</option> 
         <option value="24Element">Element</option> 
         <option value="26Pilot">Pilot</option> 
         <option value="16Passport">Passport</option> 
         <option value="15CR-V">CR-V</option> 
         <option value="19S2000">S2000</option> 
         <option value="25Insight">Insight</option> 
         <option value="29Accord Crosstour">Accord Crosstour</option> 
         <option value="31Crosstour">Crosstour</option> 
         <option value="30CR-Z">CR-Z</option> 
         <option value="27Ridgeline">Ridgeline</option> 
         <option value="28Fit">Fit</option> 
        </select> 
        <select disabled ="" id="vehic_sel_year"> 
        <option value="">Choose Year</option> 
        </select> 
        <select disabled= "" id="vehic_sel_trim" onchange="VehicPaste()"> 
         <option value="">Choose Trim Level</option> 
        </select> 
<script src="/v/js.js"></script>  
<script src="/v/Fade to New DIv.js"></script> 
<script src="/v/OpenSecondRow.js"></script> 
<script> 
function VehicPaste() { 
    var Vehicle =document.getElementById('vehic_sel_model').options[document.getElementById('vehic_sel_model').selectedIndex].text + " "+document.getElementById('vehic_sel_year').options[document.getElementById('vehic_sel_year').selectedIndex].text+ " "+ document.getElementById('vehic_sel_trim').options[document.getElementById('vehic_sel_trim').selectedIndex].text; 
    document.getElementById("VehicleMessage").innerHTML = "Honda " + Vehicle; 
} 
</script> 
</div> 
</div> 
</div> 
<div id="vehic_submit" style= "display: none"> 
<div id="VehicleMessage"></div> 
<input id = "changeVehic" type="image" src="/v/changevehicle_btn.gif.png"> 
<script> 
$(document).ready(function() { 
    $("#changeVehic").click(function(){ 
     $('#vehic_submit').fadeOut(0, function() { 
      $('#bl_firstRow').html($('#bl_firstRow').html()); 
      $('#bl_firstRow').fadeIn(0); 
     }); 
    }) 
}); 
</script> 
         </div> 
      <div class="clearfloat"> 
      </div> 
<br> 
     <div id="bl_secondRow" style="display:none"> 
      <div id="vehic_sel2"> 
       <div class="sel_label"> 
        <div class="sel_label"> 
         Shop By Category: 
        </div> 
       </div> 
           <div class="sel_container"> 
        <select id="vehic_sel_section"> 
         <option value="">Choose Engine</option> 
        </select> 
<script> 
    $(function goto(){ 
     $('#vehic_sel_section').on('change', function() { 
      var url = "/SearchResults.asp?Cat="+document.getElementById('vehic_sel_section').value 
      if (url) { 
       window.location = url; 
} 
     }); 
    }); 
</script> 
</div>

來源

2016-01-28 Colton Stockes

更多的項目，你應該檢查'localStorage'你應該檢查http://stackoverflow.com/questions/2010892/storing-objects-in-html5-localstorage –

@ParthTrivedi你應該做出答案！ – GMaiolo

如果您想要更好的瀏覽器支持，或者如果您不介意使用服務器端代碼，那麼您也可以將數據作爲參數添加到網址中作爲#hastag。 – seahorsepip

change的<select>事件時，可以localStorage

localStorage.setItem('select_vehic_sel_model', JSON.stringify($(this).val()));

和DOM準備好，你可以拿回來as

var retrievedObject = localStorage.getItem('select_vehic_sel_model'); 

if(retrievedObject!=undefined && retrievedObject!=null){ 
    $("#vehic_sel_model").val(retrievedObject); 
}

You c一個讓json對象，如果您有像

var json = { 
"select_vehic_sel_model":"<value>", 
"textbox":"<value>", 
"div_status":"hide", 
}

來源

2016-01-28 03:10:47

有幾個可用的選項給你一些在評論中已經指出。

使用localStorage保存您在頁面加載是本地訪問需要的數據位（因此得名：P）。您可以在MDN上閱讀更多關於它的信息：https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
在URL中使用查詢參數，因此標記?item1=val1&item2=val2或其一些變體。
使用散列標籤將數據類似地附加到數字2，但它實際上不會發送到服務器。例如：#item1=asdasd,item2=valasd2。

您也可以字符串化一個對象並存儲JSON的URL等

來源

2016-01-28 03:08:59 michael

如何在window.location之後存儲數據？

回答

相關問題