Maison >interface Web >js tutoriel >Explication détaillée des exemples d'utilisation de window.open dans les compétences JavaScript_javascript

Explication détaillée des exemples d'utilisation de window.open dans les compétences JavaScript_javascript

WBOYoriginal: 2016-05-16 16:04:061339parcourir

Cet article analyse plus en détail l'utilisation de window.open en JavaScript. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants :

Copier le code Le code est le suivant :

497a1b4912f017ce0c33663b08c97cb9

window.open ('page.html', 'newwindow', 'hauteur=100, largeur=400, haut=0, gauche=0, barre d'outils=non, barre de menu=non, barres de défilement=non, resdimensionnable=non,emplacement=non , status=no') //Écrivez sur une seule ligne 

2cacc6d41bbb37262a98f745aa00fbf0

Explication des paramètres :

le script js démarre

Commande window.open pour ouvrir une nouvelle fenêtre
Nom du fichier 'page.html' de la fenêtre pop-up
'newwindow' Le nom de la fenêtre pop-up (pas le nom du fichier), facultatif, peut être remplacé par un '' vide
; hauteur=100 hauteur de la fenêtre ;
largeur = 400 largeur de la fenêtre ;
top=0 valeur de pixel au-dessus de la fenêtre depuis l'écran
left=0 valeur de pixel de la fenêtre du côté gauche de l'écran
toolbar=no s'il faut afficher la barre d'outils, yes signifie afficher
barre de menus, les barres de défilement représentent les barres de menus et les barres de défilement.
redimensionnable=no S'il faut autoriser la modification de la taille de la fenêtre, yes signifie que c'est autorisé
; location=no s'il faut afficher la barre d'adresse, oui est autorisé
; status=no s'il faut afficher les informations dans la barre d'état (généralement le fichier a été ouvert), yes est autorisé

;

1. Utilisez des fonctions pour contrôler les fenêtres contextuelles

Vous trouverez ci-dessous un code complet.

<html>
<head>
<script LANGUAGE="Javascript">
<!-- 
function openwin()
{ window.open("page.html", "newwindow", "height=100,width=400, toolbar=no , menubar=no, scrollbars=no,resizable=no, location=no, status=no") //写成一行
}
//-->
</script>
</head>
<body onload="openwin()">
...任意的页面内容...
/body>
</html>

Une fonction openwin() est définie ici, et le contenu de la fonction est d'ouvrir une fenêtre. Cela ne sert à rien tant qu’on ne l’appelle pas. Comment l'appeler ?

Méthode 1 : Une fenêtre pop-up apparaît lorsque le navigateur lit la page

Méthode 2 : Fenêtre pop-up lorsque le navigateur quitte la page

Méthode 3 : Appel avec une connexion : ouvrir une fenêtre Remarque : Le "#" utilisé est une connexion virtuelle.

Méthode 4 : Appeler avec un bouton :

2. Fermez régulièrement la fenêtre pop-up (certains sites Web afficheront n secondes pour accéder à la page avant l'inscription après une inscription réussie, ou sauteront d'eux-mêmes)

Ensuite, nous effectuerons quelques contrôles sur la fenêtre contextuelle et l'effet sera meilleur.

Si nous ajoutons un petit morceau de code à la page pop-up (notez qu'il est ajouté au HTML de page.html, pas à la page principale, sinon...), ne serait-il pas plus cool qu'elle se ferme automatiquement après 10 secondes ?

Tout d'abord, ajoutez le code suivant dans la zone du fichier page.html :

<script language="Javascript">
function closeit()
{
setTimeout("self.close()",10000) //毫秒
}
</script>

Ensuite, utilisez cette phrase pour remplacer la phrase originale dans page.html.

(N'oubliez pas d'écrire cette phrase ! La fonction de cette phrase est d'appeler le code pour fermer la fenêtre, et la fenêtre se fermera automatiquement au bout de 10 secondes.

3. N'ouvrez la fenêtre qu'une seule fois (contrôle des cookies)

Rappelez-vous que même si la fenêtre contextuelle ci-dessus est intéressante, il y a un léger problème. Par exemple, si vous placez le script ci-dessus dans une page qui doit être transmise fréquemment (comme la page d'accueil),
.
Ainsi, chaque fois que vous actualisez cette page, la fenêtre apparaîtra. N'est-ce pas très ennuyeux ? Y a-t-il une solution ?

Nous utilisons des cookies pour contrôler cela.

Tout d'abord, ajoutez le code suivant dans la zone HTML de la page principale :

<script>
function openwin()
{window.open("page.html","","width=200,height=200")}
function get_cookie(Name)
{
 var search = Name + "="
 var returnvalue = "";
 if (documents.cookie.length > 0) {
 offset = documents.cookie.indexOf(search)
 if (offset != -1) {
 offset += search.length
 end = documents.cookie.indexOf(";", offset);
 if (end == -1)
 end = documents.cookie.length;
 returnvalue=unescape(documents.cookie.substring(offset,end))
 }
 }
 return returnvalue;
}
function loadpopup(){
　if (get_cookie('popped')==''){
 openwin() ;
　　documents.cookie="popped=yes" ;
　}
}
</script>

Ensuite, remplacez l'original

dans la page principale par (attention, pas openwin mais loadpop !)

Cette phrase fera l'affaire. Vous pouvez essayer d'actualiser la page ou d'y accéder à nouveau, et la fenêtre ne réapparaîtra plus jamais.

J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：jQuery implémente la méthode de modification du style lorsque la souris est passée_jqueryArticle suivant：jQuery implémente la méthode de modification du style lorsque la souris est passée_jquery

Articles Liés

Voir plus