Local Storage Revealing Prototype
by toby3105
HTML
<h2>Settings</h2>
<br/>
Name:<input type="textbox" id = "NameTextBox"/>
<br/>
State:
<select id="StateSelect">
<option>Buc</option>
<option>CTA</option>
<option>Tim</option>
</select>
<button id="SubmitButton">Store Settings</button>
<button id="ClearButton">Clear Settings</button>
<br />
<span id="OutputSpan"></span>
JavaScript
var LocalStorage = function(){
}
LocalStorage.prototype = function(){
var loadSettings = function(){
var name = localStorage.getItem("name");
var state = localStorage.getItem("state");
$("#NameTextBox").val(name);
$("#StatesSelect").val(state);
};
var storeSettings = function(){
try{
localStorage.setItem('name',$("#NameTextBox").val());
localStorage.setItem('state',$('#StateSelect').val());
}
catch(e){
if(e == QUOTA_EXCEEDED_ERR){
alert("Storage quota exceeded");
}
}
};
var hasLocalStorage = function(){
return ('localStorage' in window && window['localStorage']!=null);
};
return {
loadSettings:loadSettings,
storeSettings:storeSettings,
hasLocalStorage:hasLocalStorage
};
}();
$(document).ready(function(){
var ls = new LocalStorage();
ls.loadSettings();
console.log("ready");
$('#SubmitButton').click(function(){
if(ls.hasLocalStorage){
ls.storeSettings();
}
else{
alert("No local storage support");
}
});
$('#ClearButton').click(function(){
localStorage.clear();
ls.loadSettings();
});
});