Javascript Pop-up Boxes - Prompting the Prompt Box
(Page 4 of 4 )
Next we are going to create a program to insult people using a Prompt Box. The prompt box asks for a value. If the user inputs one and clicks OK, it will return the value to our program; if they click CANCEL, it will return a null value.
<html>
<head>
<script type="text/javascript">
function disp_prompt()
{
var name=prompt("Enter Your Name for a Prediction","Some Loser")
if (name!=null && name!="")
{
document.write("Hello " + name + "! I predict you will not have a date this weekend!")
}
}
</script>
</head>
<body>
<input type="button" onclick="disp_prompt()" value="Click for a Friendly Greeting" />
</body>
</html>
Again, we have decided to allow the user to push a button to trigger our pop-up. Remember how we were lured into a false sense of security with those Jack in the Boxes? Well this is the digital version. We even give the text box a nice caption so people think everything will be okay: Click for a Friendly Greeting
When the user clicks the button it asks the user to Enter a Name for A Prediction. It displayed a default value of Some Loser (this is where things begin to go downhill for the user muahahah). Whatever they type into the prompt (and then press OK) it will then say:
Hello James! I predict you will not have a date this weekend!
Where James is the value they typed in.
If they clicked the CANCEL button, nothing would have occurred.
If we wanted to do the above without using a button for the user to press (ie; we prompted the user when the page loaded) we could do so this way:
<html>
<head>
<script type="text/javascript">
{
var name=prompt("Enter Your Name for a Prediction","Some Loser")
if (name!=null && name!="")
{
document.write("Hello " + name + "! I predict you will not have a date this weekend!")
}
}
</script>
</head>
<body>
</body>
</html>
The same result without the user having to click the button.
Well, that's it for this episode. Have fun scaring small children with your pop-up boxes; I know I will.
And be sure to come back for the next tutorial, where we discuss Functions.
Till then...
| DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware. |
/ 13 
