Bonjour. visiteurs jour : 112       Au président     Beauté santé     Infos loisirs     Ensemble      Jean      Informatique     Einstein     Santé corona

Les joies de l'informatique et de l'internet !





Coucou et merci


Accueil  Excel  Informatique  Infos  Internet  Forum  Javascript  logiciels   Programation  Sites RJ  Vidéo  Plan du site 



   

 

Introduction au DHTML

 

Le DHTML sert à rendre les éléments d'une page Web interactifs. Il permet de changer le style d'une balise sans recharger la page, d'ajouter ou de supprimer des textes, des balises ou et leurs attributs avec le langage JavaScript.

 

source : extraits commentés de wikiversity.org

 

Les évènements

Cliquer sur un lien, fermer une fenêtre, cliquer sur un bouton ou lorsque la page se charge sont des évènements qu'il est utile d'intercepter pour le cas échéant déclencher une action avec JavaScript.

 

Liste des détecteurs d'évènement JavaScript

onabort Se déclenche lorsque l'utilisateur stoppe le chargement de la page.
onblur un élément de la page perd le focus (l'utilisateur clique ailleurs).
onchange la valeur d'un champ de donnée voit sa valeur modifiée.
onclick Se déclenche lorsque l'utilisateur clique sur l'élément en question.
ondblclick Se déclenche lorsque l'utilisateur double-clique sur l'élément en question.
ondragdrop Se déclenche lorsque l'utilisateur glisse et dépose (drag and drop) un objet.
onerror Se déclenche lorsqu'une erreur apparaît sur la page (JavaScript 1.1).
onfocus Se déclenche lorsque l'utilisateur donne le focus à un élément (il clique dessus).
onkeydown Se déclenche lorsque l'utilisateur appuie une touche du clavier (JavaScript 1.2).
onkeypress Se déclenche lorsque l'utilisateur maintient une touche du clavier enfoncée.
onkeyup Se déclenche lorsque l'utilisateur relâche une touche du clavier (JavaScript 1.2).
onload Se déclenche lorsque l'utilisateur charge la page.
onmousedown l'utilisateur appuie sur un bouton de sa souris au-dessus d'un élément de la page.
onmouseout  l'utilisateur ne survole plus un élément de la page (JavaScript 1.1).
onmouseover Se déclenche lorsque l'utilisateur survole un élément de la page.
onmouseup l'utilisateur arrête d'appuyer sur un bouton de sa souris au-dessus d'un élément de la page. (Utilisé dans glisser déposer)
onreset l'utilisateur clique sur un input de type reset (réinitialisation d'un formulaire).
onresize Se déclenche lorsque l'utilisateur redimensionne la fenêtre actuelle.
onselect l'utilisateur sélectionne un texte dans un champ de type text ou textarea.
onsubmit l'utilisateur soumet un formulaire (soit clique sur bouton soit touche [enter]).
onunload Se déclenche lorsque l'utilisateur quitte la page actuelle.

 


 

Exemple : dire bonjour à l'ouverture de la page

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
function direBonjour() {
        alert('Bonjour à vous !');
}
</script>
</head>

<body onload="direBonjour();">
...

 

Reconnaissance à la volée

N'importe quel évènement peut  être intercepté "à la volée" depuis la balise <script>.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
window.onload = direBonjour;

function direBonjour() {
        alert('Bonjour à vous !');
}
</script>
</head>

<body>
...

 

 

 

-
vues  1369     En ligne actuellement :   2   Total des clics  1571530