Prise en main de jQuery

Premiers pas

Qu'est-ce que jQuery “write less, do more” (slides)

un exemple “live” : http://ogo.heig-vd.ch/ajaxrad/Part2/Hellojquery_1.html
(jQuery vs $, sélecteurs, chaînage, ...)

continuons la découverte par l'exemple :

http://ogo.heig-vd.ch/ajaxrad/Part2/jquerySimplement.html

http://ogo.heig-vd.ch/ajaxrad/Part2/jquerySelectors.html

http://ogo.heig-vd.ch/ajaxrad/Part2/jqueryEvents.html

Exercice : refaire le TP2 avec jQuery

TP4 : les bases

jQuery : sélecteurs , événements, manipulation du DOM et fonctions de base (auteur : N. Chabloz)

A partir de la page TP4_0.html, programmez les fonctionnalités suivantes en utilisant les avantages de jQuery décrits dans la page :

Au chargement de la page, les réponses du questionnaire doivent être invisible.

Lorsque l’utilisateur clique sur une des questions, la réponse adéquate doit être affichée.

Au chargement de la page, toutes les questions du formulaire sont préfixées d’une numérotation comme présentée dans la capture d’écran suivante (Q1, Q2, ...) :

Les définitions du « résumé jQuery » doivent s’afficher en rouge (via la CSS) lorsque la souris passe sur eux et redevenir comme avant lorsque la souris quitte la définition.

Le petit formulaire en bas de page doit permettre l’ajout d’une nouvelle note dans la liste des notes.

Lorsque la souris passe sur une des notes, son fond devient rouge (via la CSS), il redevient de la couleur par défaut lorsque la souris quitte la note.

jQuery et AJAX