JavaScript - localStorage
Hej, jag försöker göra en enkal lösning där jag skriver in två tal på en sida. På nästa sida ska den plussas ihop. Dock funkar det inte, utan måste skriva in talen, trycka på knappen, få upp sidan där resultatet ska komma, backa och trycka igen för att uträkningen ska fungera.
Har någon en lösning på detta?
HTML1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="app.js" defer></script>
<title>Document</title>
</head>
<body>
<a href="faktura.html">Visa Faktura</a>
<form>
<input type="number" id="kostnad1" placeholder="Kostnad Produkt 1">
<input type="number" id="kostnad2" placeholder="Kostnad Produkt 2">
</form>
<button class="btn">Beställ</button>
</body>
</html>
HTML2
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="app2.js" ></script>
</head>
<body>
<a href="index.html">Hem</a>
<div class="divfaktura"></div>
</body>
</html>
JS1
const kostnadEtt = document.querySelector("#kostnad1").value;
const kostnadTva = document.querySelector("#kostnad2").value;
const btn = document.querySelector(".btn");
const convertKostEtt = Number(kostnadEtt);
const convertKostTva = Number(kostnadTva);
const data = convertKostEtt + convertKostTva;
btn.addEventListener("click", (e)=>{
e.preventDefault();
console.log(data)
localStorage.setItem("data", data);
setTimeout(function(){
window.document.location="./faktura.html";
}, 60000);
})
JS2
function ShowData(){
const div = document.querySelector(".divfaktura")
div.innerHTML= localStorage.getItem("data");
}
//DOMContentLoaded event väntar tills documentet laddas upp helt sedan anropar
//sedan anropar denna functionen inuti den
document.addEventListener("DOMContentLoaded", function (){
ShowData();
})
