Home >> Tutorials >> Javascript tutorials
| Previous page and Next page | Image button | Alert button |
| Prompt button | Scrolling button | Rotating button |
| Confirmation button |
Creating an Alert button
The Javascript alert is a dialogue box that pops up and takes the focus away from the current window and forces the web browser to read the message.
On clicking the button above , you will get an alert.
Javascript alerts are ideal for the following situations:
- If you want to be absolutely sure they see a message before doing anything on the website.
- You would like to warn the user about something.
- An error has occurred and you want to inform the user of the problem.
- When asking the user for confirmation of some action.
The following Source Code will add an alert by using an HTML button and the onClick event.:
<FORM NAME=”testform”>
<input TYPE=”button” VALUE=”Click me to get a free Alert 🙂 !!” onClick=”window.alert(‘Wow ! You got a free alert !!!.’); “>
</form>
Javascript- Confirmation button
The Javascript confirm function is very similar to the Javascript alert function. The following example shows how to make use of ‘confirm’ dialog box. This dialog box can be used for confirming something. The confirm box is different than the alert box in that it supplies the user with a choice, they can either press OK to confirm the popups message or they can press cancel and not agree to the popups request.This function returns a boolean value (true or false). If you press ‘Ok’, True is returned, if ‘cancel’ is pressed False is returned. After clicking OK or ‘cancel’, see the status bar for results.
<FORM NAME=”testform”>
<INPUT TYPE=”button” VALUE=”Are you ready ??!!”
onClick=”retval = window.confirm(‘ Are you ready ?!!?’);
window.status=(retval)?’You pressed OK’:’You pressed cancel’; “>
</form>
Javascript – Prompt
‘Prompt’ can be used to get user input.
Eg: Click the following button. See the status bar for results
<FORM NAME=”testform”>
<INPUT TYPE=”button” VALUE=”Click me to get a prompt”
onClick=”var retval = window.prompt(‘Enter some Text:’,’This is the default value. Enter some text here’);
window.status=retval; “>
</FORM>