<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Segurança Infantil</title>
<script src="script.js"></script>
</head>
<body>
<h1>Aprenda a se cuidar!</h1>
<form id="formSeguranca">
<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome" required><br>
<label for="idade">Idade:</label>
<input type="number" id="idade" name="idade" required><br>
<label for="telefone">Telefone para Emergências:</label>
<input type="tel" id="telefone" name="telefone" required><br>
<p>Se alguém estranho te abordar na rua, o que você deve fazer?</p>
<input type="radio" id="opcao1" name="abordagem" value="1">
<label for="opcao1">Pedir ajuda a um adulto de confiança.</label><br>
<input type="radio" id="opcao2" name="abordagem" value="2">
<label for="opcao2">Correr e gritar por socorro.</label><br>
<input type="radio" id="opcao3" name="abordagem" value="3">
<label for="opcao3">Conversar com o estranho e seguir suas orientações.</label><br>
<input type="submit" value="Enviar">
</form>
<script>
document.getElementById("formSeguranca").addEventListener("submit", function(event) {
event.preventDefault();
let nome = document.getElementById("nome").value;
let idade = document.getElementById("idade").value;
let telefone = document.getElementById("telefone").value;
let abordagem = document.querySelector('input[name="abordagem"]:checked').value;
// Verifica a resposta da criança e fornece feedback
if (abordagem == 1) {
alert(`${nome}, você fez a escolha correta! Sempre peça ajuda a um adulto de confiança.`);
} else if (abordagem == 2) {
alert(`${nome}, é importante pedir ajuda a um adulto, mas não recomendamos correr e gritar sozinho. Peça ajuda a alguém próximo.`);
} else if (abordagem == 3) {
alert(`${nome}, nunca siga as orientações de estranhos. Sempre peça ajuda a um adulto de confiança.`);
}
// Salva os dados ou envia para um servidor
console.log(`Nome: ${nome}, Idade: ${idade}, Telefone: ${telefone}, Resposta: ${abordagem}`);
});
</script>
</body>
</html>