HTML Goodies: Script Tip: Week 75

By Joe Burns


Hey there...

     This is the third in a string of JavaScript password scripts. In this script we again use a format in which the password is the name of the page to be linked to, except in this one, the concept is further hidden because the user will not put in the name of the page. The user will put in a numeric password which will then be turned into the name of the page by the script.

     It's done through an array. Let's take a look.

Here's the Script

Use the password 145

Here's the Code

     Of course when we have form elements in a script, we start with them so we can understand the hierarchy statements in the functions.

<FORM NAME="userInput">
<INPUT TYPE="text" Name ="u1" SIZE="2">
<INPUT TYPE="text" Name ="u2" SIZE="2">
<INPUT TYPE="text" Name ="u3" SIZE="2">
<INPUT TYPE="button" VALUE="Enter" onClick="GoIn()">

     The form itself is given the name "userInput". Following the form flag are three input text boxes, each set to accept only two characters.

     The text boxes are named "u1" "u2" and "u3" down the line.

     A final button triggers a function called GoIn(). Now we can put together hierarchy statement to grab whatever the user puts into the boxes. Now the GoIn() function:

function GoIn()
var Password = new Array("p","j","l","z","o","e","m","b","x","z")

     The function starts with an array. We've used the format before. The array is named "Password". Each element in the array is a text string because it is contained within double quotes. A comma separates each item, with no spaces.

     What isn't shown here is what helps us to use the script as a password function. Any time you set up an array in JavaScript, the array list members are given numbers starting at zero and counting up until JavaScript runs out of things to count.

     In this case, "p" is zero, "j" is one, "l" is three, and so forth. That will become important in a moment.

function getNumbers() { return document.userInput.u1.value
return document.userInput.u2.value
return document.userInput.u3.value

     Next, a second function, getNumbers(), is employed to simply return, to the script, the numbers the user put into the text boxes. Note that the three hierarchy statements are each attached to one of the three text boxes.

var input1 = document.userInput.u1.value
var input2 = document.userInput.u2.value
var input3 = document.userInput.u3.value

     Next, the three input items that are returned from the three text boxes are given the variable names "input1", "input2", and "input3". Please remember when grabbing values from form elements, the use of the command "value" is very important at the end of the hierarchy statement.

var pw1 = Password[input1]
var pw2 = Password[input2]
var pw3 = Password[input3]

     Here the array is called upon three times ("Password" is the name assigned to the array, remember?). The array items pulled out will be equal to the three numbers entered by the user. Notice that each time, the variable names assigned to the user's choices are used within square brackets.

     This format works basically like a replacement. Whatever number the user put in will replace the variable name. So if the user put zero in the first box, "input1" will be replaced by zero and the first letter of the array, "p", will be returned. That happens three times, assigning the variables "pw1", "pw2", and "pw3", for each of the text boxes.

var pw = pw1 + pw2 + pw3
if (pw == pw1+pw2+pw3)
{location.href = pw+ ".html"}

     Last but not least, the variable "pw" is created and given the value of the three variables put together.

     An If statement asks if "pw" is equal to pw1+pw2+pw3. Of course it is. We just set it to that. Since it is, then the commands location.href trigger, taking the user to the page name created by the user's three numbers plus .html.

Do that again...

Want more information about password scripts?
Search the Web.

     The password for this script is 145. If you count into the array to one, you get "j". remember that the "p" is zero. Count to 4 and you get "o". Count one more and you get "e".

     Put them all together and add .html and you get the page name "joe.html". If you retry the password, you note that joe.html is the page you were sent to.

     If works pretty much the same way as the last script only this time around, the password is truly different than what the user will go to.

     Pick the one you like. Each has its own merits and each can be defeated. I actually like the first one I showed. It's simple and if the user is willing to go through what it takes to steal that code, he or she should probably get to come in.

Next Week: Is that your final answer? A Game Show Script

     Do YOU have a Script Tip you'd like to share? How about suggesting a Script Tip to write about? I'd love to hear it. Write me at:

Learn to write your own JavaScripts with the HTML Goodies 30-Step Primer Series

Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
Thanks for your registration, follow us on our social networks to keep up-to-date