L'objet window

L'objet window

Propriétés et méthodes de l'objet window

Certaines propriétés et méthodes de l'objet window ne vous sont pas inconnues :
- celles des boites de dialogue. Soit alert(), confirm(), et prompt()
- et celles du ou des minuteries. Soit setTimeout() et clearTimeout().

Une autre série, ayant trait aux frames, fait l'objet d'un chapitre consacré à ce sujet :
- ce sont frames[], length, parent , opener et top.

Une série a trait à la barre d'état qui est abordée ci-après :
- ce sont status et defaultStatus.

Une série pour l'ouverture et la fermeture d'une fenêtre :
- ce sont open() et close().

Et enfin self qui renvoie à la fenêtre en cours.

Utilisation de la barre d'état

Avec Javascript, la barre d'état (petite bande située au bas de la fenêtre du browser et qui vous informe sur l'état des transferts et des connections) peut être utilisée pour afficher des messages de votre cru. Comme je suis myope comme une taupe, ce n'est pas ma partie préférée du Javascript mais c'est une opinion des plus subjective.

Les propriétés mises en oeuvre sont :

Propriété	Description
status	valeur du texte affiché dans la barre d'état de la fenêtre.
defaultStatus	valeur par défaut qui s'affiche dans la barre d'état.

Généralement, cet événement est mis en oeuvre par un onmouseOver() sur un lien hypertexte.

En voici un exemple :

A voir ici
(simple survol)

Il est indispensable d'ajouter return true;

Ouverture et fermeture de fenêtres (théorie)

Les méthodes mises en oeuvre sont :

Méthodes	Description
open()	ouvre une nouvelle fenêtre.
close()	ferme la fenêtre en cours.

La syntaxe est :

[window.]open("URL","nom_de_la_fenêtre","caractéristiques_de_la fenêtre")

où URL est l'URL de la page que l'on désire afficher dans la nouvelle fenêtre. Si on ne désire pas afficher un fichier htm existant, on mettra simplement ''".

où caractérstiques_de_la _fenêtre est une liste de certaines ou de toutes les caractéristiques de fenêtre suivantes que l'on note à la suite, séparées par des virgules et sans espaces ni passage à la ligne.

Caractéristique	Description
toolbar=yes ou no	Affichage de la barre d'outils
location=yes ou non	Affichage de champ d'adresse (ou de localisation)
directories=yes ou no	Affichage des boutons d'accès rapide
status=yes ou no	Affichage de la barre d'état
menubar=yes ou no	Affichage de la barre de menus
scrollbars=yes ou no	Affichage des barres de défilement. (scrollbars=no fonctionne mal sous Explorer 3.0)
resizable=yes ou no	Dimensions de la fenêtre modifiables
width=x en pixels	Largeur de la fenêtre en pixels
height=y en pixels	Hauteur de la fenêtre en pixels

On peut aussi utiliser 1 ou 0 au lieu de yes ou no.

Remarques :

Cette nouvelle fenêtre va s'afficher un peu n'importe où sur votre écran. Vous ne pouvez pas décider de l'endroit exact où elle peut apparaître. Cependant sous Netscape 4 c.-à-d. sous Javascript 1.2 , ce petit "plus" est possible.

Sous Microsoft Explorer 3, l'apparition de la nouvelle fenêtre se fait après une grimace du browser (il ouvre temporairement une nouvelle fenêtre du browser).

L'usage des nouvelles fenêtres est assez sympathique en Javascript pour afficher des informations complémentaires sans surcharger la page (ou fenêtre) de départ. Cependant, aussi longtemps que l'utilisateur ne ferme pas ces nouvelles fenêtres, celles-ci restent ouvertes (lapalissade). Le pire est lorsqu'on les minimise. Pour peu qu'on utilise souvent cette technique, le navigateur se retrouve avec plusieurs dizaines de fenêtres ouvertes ce qui fait désordre, ralentit le système et peut finir par le planter.

Veillez donc à toujours faire fermer ces nouvelles fenêtres.

Ouverture et fermeture de fenêtres (exemples)

---		Ouverture par un bouton (avec code dans le onClick) Nous allons ouvrir un petite fenêtre qui affiche le fichier test.htm avec un bouton dans la page. Fichier test.htm : <HTML> <BODY> <H1>Ceci est un test<HI> <FORM> <INPUT TYPE="button" value= " Continuer " onClick="self.close()"> </FORM> </BODY> </HTML> où self.close() fermera la fenêtre courante, c.-à-d. la nouvelle fenêtre. Dans la page de départ : <FORM> <INPUT TYPE ="button" value="Ouvrir une nouvelle fenêtre" onClick="open('test.htm', 'new', 'width=300,height=150,toolbar=no,location=no, directories=no,status=no,menubar=no,scrollbars=no,resizable=no')"> (sans espaces ni passage à la ligne) </FORM>
---		Ouverture par un bouton (avec appel d'une fonction) Dans la page de départ : <SCRIPT LANGUAGE="javascript"> <!-- function new_window() { xyz="open('test.htm', 'new', 'width=300,height=150,toolbar=no,location=no, directories=no,status=no,menubar=no,scrollbars=no,resizable=no')"> // sans espaces ni passage à la ligne } // --> </SCRIPT> <FORM> <INPUT TYPE ="button" value="Ouvrir une nouvelle fenêtre" onClick="new_window()"> </FORM>
---		Fermeture automatique après x secondes Avec ce script, sans intervention de l'utilisateur, la nouvelle fenêtre se ferme de façon automatique après 4 secondes. En cliquant sur le bouton, l'utilisateur interrompt prématurément le compteur et ferme la fenêtre. Avec ce système, on est certain que le nouvelle fenêtre sera fermée. La page test.htm devient test.htm <HTML> <BODY onLoad='compt=setTimeout("self.close();",4000)'> <H1>Ceci est un test</H1> <FORM> <INPUT TYPE="button" value=" Continuer " onClick="clearTimeout(compt);self.close();"> </FORM> </BODY> </HTML> Dans la page de départ : <FORM> <INPUT TYPE ="button" value="Ouvrir une nouvelle fenêtre" onClick="open('test.htm', 'new', 'width=300,height=150,toolbar=no,location=no, directories=no,status=no,menubar=no,scrollbars=no,resizable=no')"> (sans espaces ni passage à la ligne) </FORM>
---		Ouverture en cliquant sur un lien ou une image On ajoute simplement le "onClick=open..." à la balise <A> du lien ou de l'image. Dans la page de départ, on a : <A HREF="#" onClick="open('test.htm', '', 'width=300,height=150,toolbar=no,location=no,directories=no,status=no,menubar= no,scrollbar=no,resizable=no')">lien de test</A> (sans espaces ni passage à la ligne) lien de test (cliquez) La fermeture automatique est particulièrement utile ici car si l'utilisateur clique quand même, la nouvelle fenêtre disparaît derrière la fenêtre de départ et risque donc de ne pas être fermée.
---		Ouverture par survol du lien (Javascript 1.0) On utilise ici onmouseOver. Pour rappel, Javascript 1.0 donc compatible Explorer 3. Dans la page de départ, on a : <A HREF="#" onmouseOver="open('test.htm', '', 'width=300,height=150,toolbar=no,location=no,directories=no,status=no,menubar= no,scrollbar=no,resizable=no')">lien de test</A> (sans espaces ni passage à la ligne) lien de test (simple survol)
---		Ouverture par survol du lien et fermeture en quittant le lien (Javascript 1.1) 0n utilise ici onmouseOver et onmouseOut. Pour rappel, onmouseOver est du Javascript 1.1 et ne fonctionne donc pas sous Explorer 3.0. Dans la page de départ, on a : <A HREF="#" onmouseOver="open('test.htm', '', 'width=300,height=150,toolbar=no,location=no,directories=no,status=no,menubar= no,scrollbars=no,resizable=no')" onmouseOut="self.close()">lien de test</A> (sans espaces ni passage à la ligne) Pour la compatibilité avec les lecteurs utilisant Explorer 3.0, il n'y a pas d'exemple ici.
---		Ecrire dans la nouvelle fenêtre On passe par l'ouverture d'un nouvelle fenêtre par l'appel d'une fonction. Dans la page de départ : <SCRIPT LANGUAGE="Javascript"> <!-- function opnw(){ msg=window.open("","","width=300,height=50,toolbar=no,location=no,directories=no, status=no,menubar=no,scrollbars=no,resizable=no"); msg.document.write('<HTML> <BODY>' + '<CENTER><H1>Ceci est un test<H1></CENTER>' + '</BODY></HTML>') // sans espaces ni passage à la ligne } // --> </SCRIPT> Selon l'auteur, avec cette forme d'écriture, il n'y a pas moyen de fermer la fenêtre par un bouton (Help...)