Fordham, the Jesuit University of New York

CISC 3300 L01

Internet & Web Programming

Spring, 2015

Dr. Robert K. Moniot


back Back to course home page

Web Project 11: jQuery

Assigned: Monday, April 20
Due date: Monday, April 27
Points: 10

The aim of this project is to get familiar with jQuery methods.

Specifications

For this project, no server side interaction is needed, so name the main project page file project11.html. The page needs style rules, which go in an external stylesheet file named project11.css. The JavaScript code goes in an external file named project11.js. Also include jQuery from a CDN.

The page contains a text box in which the user can type a line of text, then below that three buttons whose function is explained later, then an area (use a div) where content will appear. No form tag, please.

When the user types some text in the input box and it is accepted (use the change event), the text is appended in a new div at the end of the content area. The input box is cleared.

Each line of text that has been entered is made clickable: when clicked it is highlighted (or highlighting is turned off). Use a class for highlighting. All highlighted lines are affected by button clicks as follows.

One of the buttons toggles bold facing of the selected text. Another similarly toggles italics. Use classes for these. The third button deletes the selected line(s) of text. All highlighted lines are affected at the same time.

Use unobtrusive techniques, and jQuery methods rather than native JavaScript wherever applicable. This project should not require a great deal of JS code: most of the event handlers can be 1 or 2 jQuery statements.

Note: Your project page must pass the W3C validator with no more than the unavoidable warning about the experimental HTML5 conformance checker.