Putting JavaScript to Work: Events

Question 1

onclick event

Answer 1

• The onclick event occurs when the user clicks on an element.
• HTML:
• JavaScript: object.onclick = function(){myScript};
• JavaScript, using the addEventListener () method: object.addEventListener(“click”, myScript);

Question 2

onload event

Answer 2

• The onload event occurs when an object has been loaded.
• onload is most often used within the element to execute a script once a web page has completely loaded all content (including images, script files, CSS files, etc.).
• The onload event can be used to check the visitor’s browser type and browser version, and load the proper version of the web page based on the information.
• The onload event can also be used to deal with cookies (see “More Examples” below).
• Execute a JavaScript immediately after a page has been loaded:
• In HTML:
• In JavaScript: object.onload = function(){myScript};
• In JavaScript, using the addEventListener() method: object.addEventListener(“load”, myScript);

Question 3

onblur event

Answer 3

• The onblur event occurs when an object loses focus.
• The onblur event is most often used with form validation code (e.g. when the user leaves a form field).
• Tip: The onblur event is the opposite of the onfocus event.
• Tip: The onblur event is similar to the onfocusout event. The main difference is that the onblur event does not bubble. Therefore, if you want to find out whether an element or its child loses focus, you could use the onfocusout event. However, you can achieve this by using the optional useCapture parameter of the addEventListener() method for the onblur event.
• In HTML:
• In JavaScript: object.onblur = function(){myScript};
• In JavaScript, using the addEventListener() method:
  object. addEventListener(“blur”, myScript);

Question 4

What does the event onBlur do?

Answer 4

• It allows some action to happen when the user clicks away from a form field or other element that they had just previously been in. It’s useful for providing feedback to a user based on their input - in a way, it can be used as a less obtrusive from of an alert for certain things.

Question 5

What does the event onLoad do?

Answer 5

• It executes some JavaScript instructions when a webpage loads.