LocalStorage: Deaktiviert Option auswählen Gerendert Leer

Question

Ich verwende LocalStorage, um den Wert von Feldern zu speichern. Mir ist jedoch aufgefallen, dass die Standardauswahloption (deaktiviert) leer ist. Wie rende ich es richtig?

Feld auswählen

<select name="purchasableId" id="metreSelect" class="metre" required> 
    <option value="" disabled selected>Select number of metres</option> 
    <option value="one">One</option> 
    <option value="two">Two</option> 
</select> 

loadStorage Funktionen

function loadSettings() { 
    $("#metreSelect").val(localStorage.setmetre); 
} 

function saveSettings() { 
    localStorage.setmetre = $("#metreSelect").val(); 

} 

Answer 1

Zuerst müssen Sie den ausgewählten Wert in localstorage auf Wechsel wählen speichern.

$("#metreSelect").change(function(){ 
    saveSettings($(this).val()); 
}); 

function saveSettings(val) { 
    localStorage.setItem("selectedMetre",val); 
} 

, während die Seite geladen wird, müssen Sie für gespeicherte Wert überprüfen, falls vorhanden, setzen Sie diesen Wert als ausgewählte Wert

loadSettings(); 
function loadSettings() { 
    if(localStorage.getItem("selectedMetre")){ 
    $("#metreSelect").val(localStorage.getItem("selectedMetre")); 
    } 
} 

Check jsfiddle