HTML Username and Password

67,176

37

17

Posted

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.

http://drive-html-viewer.pansy.at/?state=%7B%22ids...

Share

Recommendations

  • Epilog Challenge 9

    Epilog Challenge 9
  • Sew Warm Contest 2018

    Sew Warm Contest 2018
  • Gluten Free Challenge

    Gluten Free Challenge
user

We have a be nice policy.
Please be positive and constructive.

Tips

Questions

15 Comments

to open the link, right click it and then push "go to http://drive-html-viewer.pansy.at/?state=%7B%22ids%22:%5B%220B1QDlKbOmLfiSGZnQUx2cmRfSTA%22%5D,%22action%22:%22open%22,%22userId%22:%22111715455346247284542%22%7D" when you do that, and log in, it might not work because i'm using google drive to host the link. but don't worry, all you have to do is copy and paste the code into notepad, and then save it as "whatever.html".

If you view the page source before attempting a login you can read the login and password credentials in plain text. Doesn't seem too secure to me.

How do I get it to let me have multiple destinations, if that is even possible?

Is it possible to encrypt using HTML? is encrypt="sha1" valid?

Hey im using this in a HTML and it only works up to u10 and p10 What have i done wrong and how do i fix it????

<head>

<script>

function Login(form) { username = new Array("Jayden","Michael","u3","u4","u5","u6","u7","u8","u9","u10",”u11”,”u12”,”u13”,”u14”,”u15”,”u16”,”u17”,”u18”); password = new Array("123456","123456","p3","p4","p5","p6","p7","p8","p9","p10",”p11”,”p12”,”p13”,”p14”,”p15”,”p16”,”p17”,”p18”); page = "www.currumbinavenuechristmaslights.com" + ".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] || form.username.value == username[10] && form.password.value == password[10] ||

form.username.value == username[11] && form.password.value == password[11] || form.username.value == username[12] && form.password.value == password[12] ||

form.username.value == username[13] && form.password.value == password[13] || form.username.value == username[14] && form.password.value == password[14] ||

form.username.value == username[15] && form.password.value == password[15] || form.username.value == username[16] && form.password.value == password[16] ||

form.username.value == username[17] && form.password.value == password[17] || form.username.value == username[18] && form.password.value == password[18]) { 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>

what do u save it as?

How do you add multiple usernames and passwords?

Re copy and paste the last function

function Login(form) { username = new Array("1"); password = new Array("2"); 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; }

function Login(form) { username = new Array("3"); password = new Array("4"); 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; }

Now when I tried to use another user it wouldn't let me sign into both it would only let me sign into the bottom one. What would I do to be able to use all of them?

Can I see your code.