JavaScript OnClick Event

This event handler is used to instruct the browser on What action to take when a certain object is clicked.

If the concept of events is new to you, it is recommened that you first see lesson on What are Javascript events

Syntax

onclick="functionname( )"

The name of function that has to be called when this event occurs.
NOTE: Simple Js code can also be written here instead of calling function, but standard practice with events is to use them with functions.

Step 1- Declare the function

• We declared a funciton in the head section of the page and named it 'welcome'.
• No variables were required for this simple operation, so the ( ) are empty.
• In the Curly Braces, we wrote instructions on what to do when the function is called by its name from anywhere in the page.
• When the function is called, javascript should popup a 'Confirm Box' displaying a particular message.

Step 2- Call the Function

Call the function by its name where it is required.

• We created some form buttons within the body and associated a mouse OnClick event with them.
• Whenever these buttons are clicked, browser will detect the event and run the function called 'welcome'.