从javascript中的localstorage中检索多个字符串值
Posted
技术标签:
【中文标题】从javascript中的localstorage中检索多个字符串值【英文标题】:Retrieving multiple string values from localstorage in javascript 【发布时间】:2013-05-14 00:02:35 【问题描述】:我正在尝试从 javascript 中的 localstorage 中提取一串数据并组合来自多个字符串的多个值。例如 我可能有以下 2 个字符串
Bob;companyA;6141692120;email1@email.com;1 John St;;Bellevue;6056;;6;10;20.00;52.800000000000004;72.80;7.28;80.08;
Jane;companyB;6157692120;email2@email.com;1 Jack St;;Bellevue;6056;;6;10;20.00;52.800000000000004;72.80;7.28;80.08;
我想忽略前几个,然后将每个最后的 5 或 6 加在一起,所以字符串 A 中的值 [13] + 字符串 B = X 中的值 [13],会有很多字符串,它们都有随机数,我附上了下面的 javascript 代码,希望有人能指出我正确的方向。
windows.onload= getAllItems();
function getAllItems()
var all = [];
for(var i = 0, j = localStorage.length; i < j; i++)
all[i] = localStorage[i].split(';');
var sum = 0;
for(var i = 0, j = all.length; i < j; i++)
sum += all[i][12];
var bags = all[9];
var distance = all[10];
var hdelivery_fee = all[11];
var hprice = all[12];
var htotal_notax = all[13];
var hgst = all[14];
var htotal_tax = all[15];
var hordernumber = all[16];
document.write('Number of Bags; ' + bags + '<br />');
document.write('Distance; ' + distance + '<br />');
document.write('Delivery Fee; $' + hdelivery_fee + '<br />');
document.write('Price of Bags; $' + hprice + '<br />');
document.write('Total Ex-GST; $' + htotal_notax + '<br />');
document.write('GST; $' + hgst + '<br />');
document.write('Total Inc GST; $' + htotal_tax + '<br />');
document.write('hordernumber; ' + hordernumber + '<br />');
另外值得一提的是,这是一项任务,因此我不允许以任何身份使用 JSON 或 jquery
编辑:我已经更改了代码以匹配下面给出的答案,并且我认为我已经将输出从循环中取出,但是我对此非常陌生,所以很多都是命中注定的。它似乎并没有按原样工作,即使它看起来应该(对我来说)
EDIT2:为本地存储信息源添加 javascript
function source()
var newDate = new Date();
var itemId = newDate.getTime();
var values = new Array();
var name = document.getElementById("name").value;
var company = document.getElementById("company").value;
var contactnumber= document.getElementById("contactnumber").value;
var email = document.getElementById("email").value;
var address1 = document.getElementById("address1").value;
var address2 = document.getElementById("address2").value;
var suburb = document.getElementById("suburb").value;
var postcode = document.getElementById("postcode").value;
var comments = document.getElementById("comments").value;
var bags = document.getElementById("bags").value;
var distance = document.getElementById("distance").value;
var hdelivery_fee = document.getElementById("hdelivery_fee").value;
var hprice = document.getElementById("hprice").value;
var htotal_notax = document.getElementById("htotal_notax").value;
var hgst = document.getElementById("hgst").value;
var htotal_tax= document.getElementById("htotal_tax").value;
var hordernumber= document.getElementById("hordernumber").value;
values.push(name);
values.push(company);
values.push(contactnumber);
values.push(email);
values.push(address1);
values.push(address2);
values.push(suburb);
values.push(postcode);
values.push(comments);
values.push(bags);
values.push(distance);
values.push(hdelivery_fee);
values.push(hprice);
values.push(htotal_notax);
values.push(hgst);
values.push(htotal_tax);
values.push(hordernumber);
try
localStorage.setItem(itemId, values.join(";"));
catch (e)
if (e == QUOTA_EXCEEDED_ERR)
alert("Quota exceeded!");
EDIT3:
为报告的位置添加整个 html 页面,包括 javascript。
<html>
<head>
<title>Form Processor</title>
<link rel="stylesheet" type="text/css" href="layout.css">
</head>
<body>
<div id="header">
<h1 id="main_tile"> Everwarm Fuel Merchants - Daily Report </h1>
</div>
<h1> Daily Sales Summary <h1>
<p>
<script>
function getAllItems()
var all=[];
for (i = 0,j=localStorage.length; i<j; i++)
all[i] = localStorage.getItem(localStorage.key(i)).split(';');
function getTotal(index)
var sum = 0;
for(var i = 0, j = all.length; i < j; i++)
sum += parseFloat(all[i][index]);
return sum;
var bags = getTotal(9);
var distance = getTotal(10);
var hdelivery_fee = getTotal(11);
var hprice = getTotal(12);
var htotal_notax = getTotal(13);
var hgst = getTotal(14);
var htotal_tax = getTotal(15);
var hordernumber = getTotal(16);
document.write('Number of Bags; ' + bags + '<br />');
document.write('Distance; ' + distance + '<br />');
document.write('Delivery Fee; $' + hdelivery_fee + '<br />');
document.write('Price of Bags; $' + hprice + '<br />');
document.write('Total Ex-GST; $' + htotal_notax + '<br />');
document.write('GST; $' + hgst + '<br />');
document.write('Total Inc GST; $' + htotal_tax + '<br />');
document.write('hordernumber; ' + hordernumber + '<br />');
</script>
</p>
<input type="button" value="Clear storage" onclick="localstorage.clear()" > </input>
<input type="button" value="Return" onclick="history.back()"> </input>
</body>
</html>
【问题讨论】:
+1 表示对这门课程持开放态度。 你也不应该被允许使用document.write
呵呵,我觉得document.write
的使用是新手的第一个暗示
对了,你有什么问题?
我正在尝试从不同的字符串中添加值并显示它们,它应该是某种用于显示天数、税收等的报告,并且因为我不能使用任何类型的服务器,本地存储是我唯一的选择。所以我试图从字符串 A、B、C 等中获取值 [13] 并获取总和并将其显示在我的页面上。
【参考方案1】:
您的解决方案使用包含所有过程的循环 - 甚至包括输出! 您需要将过程分成两部分。循环部分会提取所有数据并将其全部加起来,然后输出部分不需要循环。
试试这个:
function getAllItems()
var all=[];
for (i = 0,j=localStorage.length; i<j; i++)
all[i] = localStorage.getItem(localStorage.key(i)).split(';');
function getTotal(index)
var sum = 0;
for(var i = 0, j = all.length; i < j; i++)
sum += parseFloat(all[i][index]);
return sum;
var bags = getTotal(9);
var distance = getTotal(10);
var hdelivery_fee = getTotal(11);
var hprice = getTotal(12);
var htotal_notax = getTotal(13);
var hgst = getTotal(14);
var htotal_tax = getTotal(15);
var hordernumber = getTotal(16);
document.write('Number of Bags; ' + bags + '<br />');
document.write('Distance; ' + distance + '<br />');
document.write('Delivery Fee; $' + hdelivery_fee + '<br />');
document.write('Price of Bags; $' + hprice + '<br />');
document.write('Total Ex-GST; $' + htotal_notax + '<br />');
document.write('GST; $' + hgst + '<br />');
document.write('Total Inc GST; $' + htotal_tax + '<br />');
document.write('hordernumber; ' + hordernumber + '<br />');
【讨论】:
好的,谢谢。这一切似乎都有道理,我只是无法将其放入我的代码上下文中。使用我的原始代码,我在引用它的 html 上进行了某种显示,现在当我用上面的代码替换第 3 行和第 13 行之间的所有内容时,我没有得到输出。难道我做错了什么?谢谢! 嘿,感谢您的回复,请原谅我的严重无能,但我现在无法获得输出,我应该仍然使用var hprice = all[12];
和document.write('Price of Bags; $' + hprice + '<br />');
来输出数据不应该我?
好吧,一方面,您正在写出计算结果,同时仍在 for 循环内进行计算。您需要在循环内收集结果,然后在循环外收集 document.write。你为什么要从var logLength = localStorage.length - 1;
的存储长度中减去1?
我已经更新了原始问题中的代码以匹配我认为的一切,我相信计算不再在循环中,并且 logLength 已被您提供的变量替换。请告诉我。
有了那个,我在 chromes 开发工具中收到以下错误,Uncaught TypeError: Cannot call method 'split' of undefined 我已经确认有多个字符串可用localstorage 并直接从这里复制和粘贴,我认为我被诅咒了,因为它仍然无法正常工作! :-(以上是关于从javascript中的localstorage中检索多个字符串值的主要内容,如果未能解决你的问题,请参考以下文章
javaScript中的Cookie和web Storage(LocalStorage-SessionStorage)详解
从 localStorage Typescript/JavaScript 中提取用户名