Introduction: HTML Username and Password
This instructable is about how to make a username(s) with a password for a sign in form. (or really for whatever you want to do with it).
What you need:
Simple typing program (Notepad is preferred)
A computer
A brain
That's it!
Step 1: The Code:
<html>
<head>
<script>
function Login(form) { username = new Array("username goes here"); password = new Array("password goes here"); page = "Name of html file to open when you push log in goes here" + ".html"; if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] ||
form.username.value == username[2] && form.password.value == password[2] || form.username.value == username[3] && form.password.value == password[3] ||
form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] ||
form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] ||
form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9]) { self.location.href = page; } else { alert("Either the username or password you entered is incorrect.\nPlease try again."); form.username.focus(); } return true; }
</script> </head> <body bgcolor="#eeeeee"> <form> <br> <center> <h5>Username: <input type="text" name="username" style="background:#bfbfbf;color:#212121;border-color:#212121;" onFocus="this.style.background = '#ffffff';"
onBlur="this.style.background = '#bfbfbf';"> <br> Password: <input type="password" name="password" style="background:#bfbfbf;color:#212121;border-color:#212121;" onFocus="this.style.background = '#ffffff';"
onBlur="this.style.background = '#bfbfbf';"> <br> <input type="button" value="Login" onClick="Login(this.form);" style="background:#bfbfbf;color:#000000;border-color:#212121;" onMouseOver="this.style.color =
'#404040';" onMouseOut="this.style.color = '#000000';" onFocusr="this.style.color = '#404040';" onBlur="this.style.color = '#000000';"></h5> </center> </form> </body> </html>
Step 2: The Outcome
Try it! The username is "instructables", and the password is gogoguy. When you push "login", it should take you to google.com.
Attachments
Participated in the
Tech Contest
Participated in the
DIY University Contest