CS81 – Pete Thottam

Unit 9 - chapter 6: 10, 14

#10. Implement a web page that presents an “account sign-up” form, with text input fields for a user’s real name, email address, login name, and password.

 

The web page should also provide a Submit button that would hypothetically send the account sign-up request to the (again hypothetical) server. This web page should exhibit the following behaviros:

 

 

(a)Login name and password are required fields; that is, if they are blank, the Submit button should be disabled.

 

(b)Password entry should actually consist of two input type=”password” elements and should implement the typical “please retype your password” feature of typical account sign-up forms. As with the required fields, the Submit buton should be disabled if the values in the password fields do not match.:

 

 

 

ANSWER : The program follows:

 

….

 

 

 

#14. Keyboard input raises a question: when a key is pressed, which part(s) of a web page should be notified of the event? Mouse and touch input, by their very nature, have natural targets: event notification cents on the location of the mouse or touch event. Keyboard events do not have as obvious a target.

 

 

 

The concept of focus addresses this issue: at any given tiome, one specific element, be it a text field, a drop-down menu, a button, or another element, is designated as the primary recipient of the keyboard events (around which the event bubblingand captureing cycle takes place). This elementis said to have the focus at that time. User activities such as mouse clicks or pressing the Tab key change the currently focused element.

 

 

 

The acquisition and loss of focus are events in their own right: focus and blur, respectively. Knowing the element that has keyboard focus has a number of uses, one of which is the facilitation of context-sensitive help.

 

 

 

Implement a hypothetical user profile page with context-sensitive help. The page should consist of multiple labeled text input fields. Next to each text field, supply a brief explanation of the field that is initially invisible (i.e. the display style property is set to tnone). Set up appropriate focus and blur event handlers such that the explanation elements only appear when their corresponding text field gets the keyboard focus.

 

 

ANSWER : The program