Publicado em 8 de mai.

Evitar que o navegador limpe os campos de input quando a guia perde o foco

#javascript #frontend #desenvolvimento-frontend #html

Olá.

Estou atualizando meu conhecimento com Front-End e me deparei com o seguinte problema.

Criei um sistema para fazer o upload de imagens e alguns campos text.

Algo bem simples para depois começar a estudar javascript para mostrar a miniatura....

Mas quando saio do navegador Chrome ou da aba por mais de 3 minutos, ao retornar o navegador as vezes atualiza ou nem chega atualizar mas limpa os campos.

Estou usando um Smart Motorola com Android, mas um amigo testou no iPhone e acontece a mesma coisa.

Gostaria de saber se há como usar javascript para evitar isso?

Agradeço desde já.

<!DOCTYPE html>

	<html>

	<head>

	    <meta charset="utf-8">

	    <meta name="viewport" content="width=device-width, initial-scale=1">

	    <title>Uploader</title>

	</head>

	<body>

	    <form action="?" method="post" enctype="multipart/form-data">

	        <br><br>

	        <div>selecione a imagem 1</div>

	        <input type="file" name="foto1" accept="image/*">

	        <br><br>

	        <input type="text" name="nome_imagem1">

	        

	        <br><br>

	        <input type="file" name="foto2" accept="image/*">

	        <br><br>

	        <input type="text" name="nome_imagem2">

	        

	        <br><br>

	        <input type="file" name="foto3" accept="image/*">

	        <br><br>

	        <input type="text" name="nome_imagem3">

	        

	        <br><br>

	        <input type="submit" value="Enviar">

	        <br><br>

	    </form>

	<?php

	if ($_SERVER['REQUEST_METHOD'] == 'POST')

	{

	    vardump ($_FILES);

	}

	?>

	</body>

	</html>

Discussão (2)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Carregando comentários...

<html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Uploader</title> </head> <body> <form action="?" method="post" enctype="multipart/form-data"> <br><br> <div>selecione a imagem 1</div> <input type="file" name="foto1" accept="image/*"> <br><br> <input type="text" name="nome_imagem1"> <br><br> <input type="file" name="foto2" accept="image/*"> <br><br> <input type="text" name="nome_imagem2"> <br><br> <input type="file" name="foto3" accept="image/*"> <br><br> <input type="text" name="nome_imagem3"> <br><br> <input type="submit" value="Enviar"> <br><br> </form> <?php if ($_SERVER['REQUEST_METHOD'] == 'POST') { vardump ($_FILES); } ?> </body> </html>