Chapter 13 Assignments


Home

Section 13.1 Fill in the blanks in each of the following statements

1. Event handlers can be registered in XHTML using the _______ model or in JavaScript using the _______ model.
Answer: inline, traditional

2. The state of three keys can be retrieved by using the event object. These keys are _______, _______ and _______.
Answer: Ctrl, Alt and Shift

3. If a child element does not handle an event, _______ lets the event rise through the object hierarchy.
Answer: event bubbling

4. The _______ of an event-handling function specifies whether to perform the default action for the event.
Answer: return value

5. In an event handler, the reference for the id of an element that fired an event is _______ in Firefox and _______ in Internet Explorer.
Answer: event.target.id, event.srcElement.id

6. Three events that fire when the user clicks the mouse are _______, _______ and _______.
Answer: onclick, onmousedown, onmouseup

Section 13.2 State whether each of the following is true or false. If the statement is false, explain why.

1. The onload event fires whenever an element starts loading.
Answer: False. The onload event fires when an element finishes loading

2. The onclick event fires when the user clicks the mouse on an element.
Answer: True

3. The onfocus event fires when an element loses focus.
Answer: False. It fires when an element gains focus.

4. When using the rollover effect with images, it is a good practice to create Image objects that preload the desired images.
Answer: True

5. Returning true in an event handler on an a (anchor) element prevents the browser from following the link when the event handler finishes.
Answer: False. Returning false prevents the default action.


Section 13.3 Perform the following.

Add an erase feature to the drawing program in Fig. 13.3. Try setting the background color of the table cell over which the mouse moved to white when the Alt key is pressed.
Answer: Not Required


Section 13.4 Perform the following.

Add a button to your program from Exercise 13.3 to erase the entire drawing window.
Answer: Not Required


Section 13.5 Perform the following.

You have a server-side script that cannot handle any ampersands (&) in the form data. Write a function that converts all ampersands in a form field to " and " when the field loses focus (onblur).
Answer: Not Required


Section 13.6 Perform the following.

Write a function that responds to a click anywhere on the page by displaying an alert dialog. Display the event name if the user held Shift during the mouse click. Display the element name that triggered the event if the user held Ctrl during the mouse click.
Answer: answer to 13.06


Section 13.7 Perform the following.

Use CSS absolute positioning, onmousedown, onmousemove, onmouseup and the clientX/clientY properties of the event object to create a program that allows you to drag and drop an image. When the user clicks the image, it should follow the cursor until the mouse button is released.
Answer: answer to 13.07


Section 13.8 Perform the following.

Modify Exercise 13.7 to allow multiple images to be dragged and dropped in the same page.
Answer: answer to 13.08