Can';无法修复显示Javascript中的错误
早些时候,我在html页面之间传输数据时遇到问题,但幸运的是我得到了帮助。但是,我在显示从购物车页面获取的某些价格以及在结帐页面中显示这些价格时遇到了一些问题。我这样做的方式是使用本地浏览器存储,我被告知可以使用多个实例来完成,但我肯定遗漏了一些东西Can';无法修复显示Javascript中的错误,javascript,html,Javascript,Html,早些时候,我在html页面之间传输数据时遇到问题,但幸运的是我得到了帮助。但是,我在显示从购物车页面获取的某些价格以及在结帐页面中显示这些价格时遇到了一些问题。我这样做的方式是使用本地浏览器存储,我被告知可以使用多个实例来完成,但我肯定遗漏了一些东西 //table.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <style> table, th, td {
//table.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<style>
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
<h2>Html Table</h2>
<table id="EstoreTable" style="width:100%">
<tr>
<th>Item Name</th>
<th>Quantity</th>
<th>Price</th>
</tr>
<tr>
<td>iPhone X</td>
<td>10</td>
<td>299.99</td>
</tr>
<tr>
<td>Apple Watch 3</td>
<td>12</td>
<td>250.00</td>
</tr>
<tr>
<td>MacBook Pro 13" </td>
<td>7</td>
<td>1199.99</td>
</tr>
</table>
<a href="assign1_agm75_checkout.html" target="_blank" id="checkout">Checkout</a>
<script src="CheckoutAmounts.js"></script>
</body>
</html>
//table.html
表,th,td{
边框:1px纯黑;
}
Html表格
项目名称
量
价格
iPhoneX
10
299.99
苹果手表3
12
250
MacBookPro 13“
7.
1199.99
//js文件
函数getCheckoutAmounts()
{
var table=document.getElementById('EstoreTable');//来自TestTable.html的数据
var总和=0,
taxTotal=0,
税款=.0825,
航运=5.99,
到期日=0;
对于(变量i=1;i
//Checkout.html
结账
购物总额:$
总税额:$
总运费:$
应付总额:$
//通过本地存储获取数据
document.querySelector(“#Shopamount”).textContent=window.localStorage.getItem(“总和”);
document.querySelector(“#TaxTotal”).textContent=window.localStorage.getItem(“TaxTotal”);
document.querySelector(“费用”).textContent=window.localStorage.getItem(“发货”);
document.querySelector(“#total”).textContent=window.localStorage.getItem(“到期”);
//通过查询字符串获取和
让queryString=document.location.search;
设sum=queryString.split(“=”[1];
让taxTotal=queryString.split(“=”[1];
let shipping=queryString.split(“=”[1];
let due=queryString.split(“=”[1];
document.querySelector(“#Shopamount”).textContent=sum;
document.querySelector(“TaxTotal”).textContent=TaxTotal;
document.querySelector(“费用”).textContent=shipping;
document.querySelector(“total”).textContent=到期;
购物总额:1749.98美元?总税额
税款总额:144.37335000000002美元
总运费:5.99美元
应付总额:$
然而,当我运行JS时,这是我在
checkout.html
中的结果。checkout.html还有其他部分,所以这就是为什么没有结束标记的原因。你得到了什么错误?在结帐页面上显示的结果如下:购物总额:$Total Tax:$144.37335000000002总运费费用:$5.99到期总金额:$@S.ramjit您可以编辑您的问题,将结果放在结帐页上,而不是放在评论中。可能重复
//js file
function getCheckoutAmounts()
{
var table = document.getElementById('EstoreTable'); //data from TestTable.html
var sum = 0,
taxTotal = 0,
tax = .0825,
shipping = 5.99,
due = 0;
for (var i = 1; i < table.rows.length; i++)
{
sum = sum + parseFloat(table.rows[i].cells[2].innerHTML); //stores total price into sum
}
taxTotal = tax * sum; //stores calculated tax
due = sum + taxTotal + shipping;
// SET VIA query string
this.href += "?sum=" + sum;
this.href += "?taxTotal=" + taxTotal;
this.href += "?shipping=" + shipping;
this.href += "?due=" + due;
// SET SUM VIA localStorage
window.localStorage.setItem("sum", sum);
window.localStorage.setItem("taxTotal", taxTotal);
window.localStorage.setItem("shipping", shipping);
window.localStorage.getItem("due", due);
}
document.querySelector("#checkout").addEventListener("click", getCheckoutAmounts);
//Checkout.html
<html>
<h1>Checkout</h1>
Total Shopping Amount: $<span id="Shopamount"></span><br>
Total Tax: $<span id="TaxTotal"></span><br>
Total Shipping Charges: $<span id= "charges"></span><br>
Total Amount Due: $<span id="total"></span><br>
<script>
// GET data VIA localStorage
document.querySelector("#Shopamount").textContent = window.localStorage.getItem("sum");
document.querySelector("#TaxTotal").textContent = window.localStorage.getItem("taxTotal");
document.querySelector("#charges").textContent = window.localStorage.getItem("shipping");
document.querySelector("#total").textContent = window.localStorage.getItem("due");
// GET SUM VIA query string
let queryString = document.location.search;
let sum = queryString.split("=")[1];
let taxTotal = queryString.split("=")[1];
let shipping = queryString.split("=")[1];
let due = queryString.split("=")[1];
document.querySelector("#Shopamount").textContent = sum;
document.querySelector("TaxTotal").textContent = taxTotal;
document.querySelector("charges").textContent = shipping;
document.querySelector("total").textContent = due;
</script>
Total Shopping Amount: $ $1749.98?taxTotal
Total Tax: $144.37335000000002
Total Shipping Charges: $5.99
Total Amount Due: $