pagina by @lingowebapp - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

Referenze

<iframe>Crea un frame all'interno di una pagina HTML.
targetDetermina il comportamento di un collegamento ipertestuale alla sua apertura
<ol>Crea liste ordinate o numerate.
minImposta il valore numerico o temporale minimo per un elemento input
<pre>Indica una parte di testo preformattato
methodDetermina il metodo di invio dei dati di un form al server

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

form registrazione sportiva

esercizio informatica 1

ARKO - Artificial Intelligence Kno

console elements

esercizio 2 (italia)

Adobe PDF Shared 4

Interactive Map

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<!DOCTYPE html>
<html>
<head>
	<title>Pagina di accesso e registrazione</title>
	<link rel="stylesheet" href="style.css">
</head>
<body>
	<div class="container">
		<h2>Accedi</h2>
		<form name="login" onsubmit="return validateForm()">
			<label for="username">Username:</label>
			<input type="text" id="username" name="username" required>

			<label for="password">Password:</label>
			<input type="password" id="password" name="password" required>

			<input type="submit" value="Accedi">
		</form>
		<hr>
		<h2>Registrati</h2>
		<form name="registration" onsubmit="return validateForm()">
			<label for="email">Email:</label>
			<input type="email" id="email" name="email" required>

			<label for="password1">Password:</label>
			<input type="password" id="password1" name="password1" required>

			<label for="password2">Conferma password:</label>
			<input type="password" id="password2" name="password2" required>

			<input type="submit" value="Registrati">
		</form>
	</div>
	<script src="script.js"></script>
</body>
</html>

body {
	font-family: Arial, sans-serif;
	background-color: #f2f2f2;
}

.container {
	max-width: 400px;
	margin: 50px auto;
	background-color: #fff;
	padding: 20px;
	border-radius: 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

form {
	margin-bottom: 20px;
}

label {
	display: block;
	margin-bottom: 5px;
}

input[type="text"],
input[type="password"],
input[type="email"] {
	width: 100%;
	padding: 10px;
	border-radius: 5px;
	border: 1px solid #ccc;
	margin-bottom: 10px;
	box-sizing: border-box;
}

input[type="submit"] {
	background-color: #4CAF50;
	color: #fff;
	padding: 10px;
	border: none;
	border-radius: 5px;
	cursor: pointer;
}

input[type="submit"]:hover {
	background-color: #3e8e41;
}

hr {
	border: 0;
	border-top: 1px solid #ccc;
	margin: 20px 0;
}

// Funzione per la validazione dei campi di input
function validateForm() {
  var username = document.forms["login"]["username"].value;
  var password = document.forms["login"]["password"].value;
  var email = document.forms["registration"]["email"].value;
  var password1 = document.forms["registration"]["password1"].value;
  var password2 = document.forms["registration"]["password2"].value;

  // Validazione del campo username
  if (username == "") {
    alert("Il campo username è obbligatorio.");
    return false;
  }

  // Validazione del campo password
  if (password == "") {
    alert("Il campo password è obbligatorio.");
    return false;
  }

  // Validazione del campo email
  if (email == "") {
    alert("Il campo email è obbligatorio.");
    return false;
  }

  // Validazione del campo password1
  if (password1 == "") {
    alert("Il campo password è obbligatorio.");
    return false;
  }

  // Validazione del campo password2
  if (password2 == "") {
    alert("Il campo conferma password è obbligatorio.");
    return false;
  }

  // Controllo che la password1 e la password2 siano uguali
  if (password1 != password2) {
    alert("Le password non coincidono.");
    return false;
  }

  return true;
}

// Funzione per il controllo della validità dell'email
function validateEmail(email) {
  var re = /\S+@\S+\.\S+/;
  return re.test(email);
}