localstorage效果很好。.不需要在同一页面中显示。我希望将此数据显示到下一个html页面中,div?
尝试以Div#ID不错的方式显示在下一个HTML页面中显示。每当我想调用相同数据并显示任何HTML页面?
时<form id="logForm" method="post">
<input type="text" name="project" value="Project Name">
<input type="number" name="hours" value="Hours" class="shortField">
<input type="text" name="date" value="Date" class="shortField">
<input type="submit" value="Log Time">
</form>
<ul id="theLog">
<li>Loading…</li>
</ul>
<script>
$(document).ready(function() {
if (typeof(localStorage) == 'undefined' ) {
alert('Your browser does not support HTML5 localStorage. Try upgrading.');
} else {
getAllItems(); //load the items
$("#logForm").submit(function(){
var newDate = new Date();
var itemId = newDate.getTime();
var values = new Array();
var project = $("input[name='project']").val();
var hours = $("input[name='hours']").val();
var date = $("input[name='date']").val();
//strip html tags
project = project.replace(/(<([^>]+)>)/ig, "");
values.push(project);
values.push(hours);
values.push(date);
if (project != "" && hours != "" && date != "") {
try {
localStorage.setItem(itemId, values.join(';'));
} catch (e) {
if (e == QUOTA_EXCEEDED_ERR) {
alert('Quota exceeded!');
}
}
} else {
alert("All fields are required.");
}
});
}
});
function getAllItems() {
var timeLog = ""; //the variable that will hold our html
var i = 0;
var logLength = localStorage.length-1; //how many items are in the database starting with zero
//now we are going to loop through each item in the database
for (i = 0; i <= logLength; i++) {
//lets setup some variables for the key and values
var itemKey = localStorage.key(i);
var values = localStorage.getItem(itemKey);
values = values.split(";"); //create an array of the values
var project = values[0];
var hours = values[1];
var date = values[2];
//now that we have the item, lets add it as a list item
timeLog += '<li><strong>'+project+'</strong>: '+hours+' hours - '+date+'</li>';
}
//if there were no items in the database
if (timeLog == "")
timeLog = '<li class="empty">Log Currently Empty</li>';
$("#theLog").html(timeLog); //update the ul with the list items
}
</script>
将数据存储到本地存储中后,您可以从在同一浏览器中打开的任何页面访问此数据(因为本地存储属于您的浏览器,实际上所有数据都存储在浏览器中空间,您无法从任何其他浏览器中访问一个浏览器中的数据存储)。谢谢