Come fare un pulsante con un password in HTML

August 28

Hypertext Markup Language può creare forme studiate per ottenere l'input dell'utente. È possibile creare un modulo che impedisce all'utente di continuare a un'altra pagina, o di entrare in un commento o altri dati, a meno che la password corretta viene immessa nel campo Password. Per fare un modulo protetto da password, inserire un pulsante e il campo password nella pagina, quindi aggiungere il codice JavaScript per il codice HTML per evitare che il visitatore di presentare il modulo senza prima entrare le credenziali appropriate.

istruzione

1 Aggiungere JavaScript tra i "<head>" e "<head>" tag per disabilitare l'utente di presentare il modulo a meno che non viene inserita la password corretta. È possibile utilizzare il seguente codice:

<Head>
<Script type = "text / javascript">
funzione wrongPass ()
{
if (document.form.pass.value! = "password")
{
alert ( "Si prega di inserire la password corretta per continuare.");
return false;
}
}
</ Script>
</ Head>

2 Aggiungere il "<form>" e "</ form>" tag alla pagina. Inserire i tag tra "<body>" e "</ body>".

3 Inserire "Password:" tra i "<form>" tag, quindi aggiungere un campo password per il codice HTML. Il codice dovrebbe finora simile al seguente:

<Body>
<Form>
Password: <input type = nome "password" = "pass">
</ Form>
</ Body>

4 Inserire il tag "<button>" tra i "<form>" tag e dopo il tag "<input>", in questo modo:

<Form>
Password: <input type = "password" name = "password">
<Tipo di pulsante = "submit" name = "submit"> Continua </ button>
</ Form>

5 Aggiungere l'attributo "nome" al tag "<form>", con il valore di "forma", quindi aggiungere l'attributo "onSubmit". Inserire il codice JavaScript tra le virgolette, in questo modo:

<Form name = "forma" onSubmit = "tornare wrongPass ();">

6 Sostituire "password" nel codice JavaScript con la password preferita.

Consigli e avvertenze

  • Questo articolo fornisce un modello di base con cui lavorare, ma è necessario aggiungere codice aggiuntivo per far funzionare il modulo. Cosa codice per aggiungere dipende da ciò che si desidera che il modulo per fare; per esempio, se si desidera che l'utente per inviare dati di lavoro, avresti bisogno di aggiungere elementi di input in più per la pagina e cambiare la forma di inviare la presentazione di una pagina o e-mail. Leggi forme sul W3C e W3Schools per maggiori informazioni.