Passar um valor de uma página para outra com JS

23/09/2020

0

Fala gurizada, queria uma ajuda em um código, preciso fazer os valores de um formulário aparecerem em outra página HTML e eu to aprendendo agora e não sei como fazer isso. Aqui está o código.
<-----------------------------------------------index.html---------------------------------------------------->
<!DOCTYPE html>
<html>

<head>
<title>Cadastro</title>
<meta charset="utf-8" />
<link href="home.css" rel="stylesheet" media="all" />
<script src="index.js"></script>
</head>

<body onload="dados()">
<form name="form">

<center><h1>Entre em contato conosco</h1></center>

<div>

<input type="text" id="nomeid" placeholder="Digite seu nome" required="required" name="nome" />
<br>
<input type="text" id="foneid" placeholder="(xx)xxxxx-xxxx" name="fone" />
<br>
<input type="email" id="emailid" placeholder="fulano@mail.com" name="email" />
<br>
<textarea placeholder="Deixe sua opinião"></textarea>
<br>
<input type="button" class="enviar" onclick="Enviar();" value="Enviar" />

</div>

</form>

</body>
</html>



<-----------------------------------------------------------------------------------relatorio.html------------------------------------------------------------------------------------->

<!DOCTYPE html>
<html>

<head>
<title>Relatório</title>
<meta charset="utf-8" />
<link href="home.css" rel="stylesheet" media="all" />
<script src="index.js"></script>
</head>

<body onload="dados()">
<form name="form">

<center><h1>Seus dados</h1></center>

<div>



</div>

</form>

</body>
</html>


<------------------------------------------------------------------------------------------index.js------------------------------------------------------------------------------------------>

let nome = document.getElementById("nomeid");
let fone = document.getElementById("foneid");
let email = document.getElementById("emailid");

function Enviar(){

let nome = document.getElementById("nomeid");

if (nome.value != ""){
alert('Obrigado pelo cadastro, '+nome.value+' você será redirecionado para a página dos seus dados');
window.location.href = "relatorio.html";
}else{
alert('Seu cadastro está incorreto!');
}

}

function dados(){
let nome = document.getElementById("nomeid");
return nome.textContent;

<--------------------------------------------------------------------------------------------home.css-------------------------------------------------------------------------------------->

body {
padding: 0;
margin: 0;
background-color: #363636;
}

form {
font-family: Verdana,Tahoma,sans-serif;
font-size: 15px;
width: 100%;
height: 100%;

}

div{
background-color: #C0C0C0;
width: 470px;
height: 360px;
margin: 0 auto;
border-radius: 5px;
}

h1 {
margin-bottom: 20px;
margin-left: 20px;
color: #DCDCDC;
text-shadow: 5px 5px 5px black;

}

input, textarea {
width: 200px;
padding: 10px;
color: black;
margin-left: 20px;
margin-top: 10px;
border-radius: 5px;
-moz-border-radius: 5px;
}

input:hover, textarea:hover, input:focus, textarea:focus {
border-color: #DCDCDC;
box-shadow: 1px 0px 1px ;
background-color: #FFFFFF;
color: black;
font-weight: bold;
}

.enviar {
background-color: #ffFFFF;
height: 40px;
width: 100px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border: 1px;
color: black;
}

textarea {
width: 400px;
height: 120px;
line-height: 20px;
max-width: 400px;
}

form label {
margin-left: 20px;
color: #FFFFFF;
font-weight: bold;
}



é isso preciso de ajuda
João Soares

João Soares

Responder

Que tal ter acesso a um e-book gratuito que vai te ajudar muito nesse momento decisivo?

Ver ebook

Recomendado pra quem ainda não iniciou o estudos.

Eu quero
Ver ebook

Recomendado para quem está passando por dificuldades nessa etapa inicial

Eu quero

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar