Ouvrir plusieurs javascript popup boîtes avec le clic d'un bouton

C'est un JavaScript question.

J'ai besoin de créer un bouton qui, lorsqu'il est cliqué une fois, va ouvrir 5 sous-windows (options).

Une boîte dans le coin supérieur gauche de l'écran, l'un dans le coin en haut à droite, l'un dans le coin inférieur gauche, l'un dans le coin inférieur droit, et un au centre. Chaque case aura une URL différente.

Lorsque la fenêtre principale est fermée, toutes les sous-fenêtres doivent également à proximité.

J'ai seulement été en mesure de faire le code qui ouvre un pop - up ne peut pas comprendre comment le code de tous les 5 à ouvrir à la fois avec le clic d'un bouton, puis de les fermer tous quand le parent de la fenêtre se ferme.

Voici ce que j'ai à ce jour:

<SCRIPT language="JavaScript">
function myPopup(URL) {
popupWindow = window.open(URL,'popUpWindow','height=500,width=500,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
}
</SCRIPT>

<a href="#" onclick="myPopup(this.href);return false">Open Pop-Up</a>

Un grand merci à tous ceux qui peuvent m'aider.

Merci à tous ceux qui m'aide. En utilisant les commentaires ici, j'ai travaillé sur ce projet, tous les jours, et viennent avec un code qui fonctionne. Je n'étais pas sûr de savoir comment attribuer les url pour chaque popup pour le tableau - mais au moins ils travaillent.

Cependant, je ne peux pas obtenir toutes les fenêtres pop-up à se fermer lorsque le parent de la fenêtre se ferme. J'espère que vous pouvez aider. Voici le nouveau code:

<script type="text/javascript">

/*Use Array - Open 5 new popup windows using onclick*/

function newWindow() {
 var winPop = new Array();
  winPop[winPop.length] = window.open('top_right.html','window1','scrollbars=no,width=235,height=155,left=1000,top=200,screenX=1000,screenY=200');
window.open('top_left.html','window2','scrollbars=no,width=235,height=155,left=325,top=200,screenX=325,screenY=200');
window.open('bottom_left.html','window3','scrollbars=no,width=235,height=155,left=325,top=600,screenX=325,screenY=600');
window.open('bottom_right.html','window4','scrollbars=no,width=235,height=155,left=1000,top=600,screenX=1000,screenY=600');
window.open('center_page.html','window5','scrollbars=no,width=235,height=155,left=660,top=450,screenX=660,screenY=450');
}

/*NOT WORKING FOR ME --Close all popups when parent window is closed*/

onbeforeunload = function() {
    for (var index = 0; index < winPop.length; ++index)
        winPop[index].close();
}
</script>
</head>

<body>
<div id="wrap"> <a href='' onclick='newWindow()'><img src='images/group_clicker.gif' border='0'></a> </div>
</body>
Astuce: si vous appelez window.open() s'ouvre de la fenêtre, ce qui serait d'appeler window.open() cinq fois? (En supposant que le navigateur de la fenêtre paramètres de blocage de ne pas mettre le holà sur l'ensemble de la chose.)

OriginalL'auteur user2624788 | 2013-07-27

  1. 1

    DÉMO

    Enregistrer toutes les fenêtres ouvertes d'un tableau.

    S'inscrire pour la beforeUnload événement, et quand il se déclenche, boucle à travers les fenêtres pop-up close()'ing.

    NB: je pense que c'est jsFiddle ou Chrome, mais il ne sera pas ouvert plus de 1 contextuel par clic.

    Et à cause des restrictions sur la popup d'ouverture vous ne pouvez pas fiable de contrôle de la position de l'ouverture des popups. Il peut être utile pour vous d'ouvrir la fenêtre de popups comme YUI's panneau ou jQuery(UI)'s le dialogue

    function openPopup(howMany) {
    var popups = [];

    var temp;
    for (var index = 0; index < howMany; ++index) {
        popups.push(open('', '', 'height=500,width=500'));
        popups[index].document.write('popup ' + (index + 1) + ' of ' + howMany + '<br/>this will close on parent window close');
    }

    closeFunc = function() {
        for (var index = 0; index < popups.length; ++index)
            popups[index].close();
    };

    if (addEventListener)
        addEventListener('beforeunload', closeFunc, false);
    else
        attachEvent('onbeforeunload', closeFunc);
}
    Bonjour et un grand merci à vous! Je suis en train d'appliquer ce tableau à mon projet, mais ayant des problèmes de fermeture de toutes les popups sur la fenêtre parent proche. Mu code actuel est affiché dans la question d'origine.
    votre pas réellement l'ajout de la matrice. L'utilisation de tableau.push() developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
    n'oubliez pas, si une réponse vous aide, laisser les autres savoir par upvoting il (cliquer sur la flèche à côté d'elle) même si ce n'est pas répondre à votre question (qui est ce que la tique est pour).<br/> Aussi, voir mon autre réponse à corriger ce que vous avez changé dans votre question. Devrait fonctionner ensuite
    Juste pour vous dire, j'ai compris où placer mon code dans votre code de démonstration. Le script fonctionne très bien maintenant! Je n'ai pas pu upvote votre réponse, car quand j'ai essayé, un avis est apparu que dit 15 points de réputation sont nécessaires pour le faire. J'ai seulement 1 point. Mais je n'ai sélectionner votre démonstration de la réponse que j'ai utilisé. Merci Hashbrown!
    pas de soucis, n'oubliez pas de contribuer réponses, si vous tombez sur une question dont vous connaissez la réponse!

    OriginalL'auteur Hashbrown

  2. 0

    Vous pouvez utiliser une boucle for pour ouvrir plusieurs fenêtres. Assurez-vous de donner un nom unique à la fenêtre popup

    function myPopup(URL) {
    for (var i = 0; i < 5; i++) {
        var popupWindow = window.open(URL, i, 'height=500,width=500,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
    }
}

    OriginalL'auteur Obi-Wan Spock

  3. 0

    Une réponse à votre edit:

    Vous avez écrit

    function newWindow() {
 var winPop = new Array();
  winPop[winPop.length] = window.open('top_right.html','window1','scrollbars=no,width=235,height=155,left=1000,top=200,screenX=1000,screenY=200');
window.open('top_left.html','window2','scrollbars=no,width=235,height=155,left=325,top=200,screenX=325,screenY=200');
window.open('bottom_left.html','window3','scrollbars=no,width=235,height=155,left=325,top=600,screenX=325,screenY=600');
window.open('bottom_right.html','window4','scrollbars=no,width=235,height=155,left=1000,top=600,screenX=1000,screenY=600');
window.open('center_page.html','window5','scrollbars=no,width=235,height=155,left=660,top=450,screenX=660,screenY=450');
}

    Ce que vous avez besoin est

    var winPop;

function newWindow() {
    winPop = [
        open(
            'top_right.html',
            'window1',
            'scrollbars=no,width=235,height=155,left=1000,top=200,screenX=1000,screenY=200'
        ),
        open(
            'top_left.html',
            'window2',
            'scrollbars=no,width=235,height=155,left=325,top=200,screenX=325,screenY=200'
        ),
        open(
            'bottom_left.html',
            'window3',
            'scrollbars=no,width=235,height=155,left=325,top=600,screenX=325,screenY=600'
        ),
        open(
            'bottom_right.html',
            'window4',
            'scrollbars=no,width=235,height=155,left=1000,top=600,screenX=1000,screenY=600'
        ),
        open(
            'center_page.html',
            'window5',
            'scrollbars=no,width=235,height=155,left=660,top=450,screenX=660,screenY=450'
        )
    ];
}

    C'est un problème de délimitation de l'étendue (ainsi que vous ne pas ajouter les fenêtres de la matrice :|), winPop doit être global, I. e. vard à l'extérieur de la fonction.

    Salut Hashbrown, merci pour coller avec moi sur ce point. Je vois ce que vous entendez sur l'utilisation d'une variable globale et maintenant j'ai utilisé le code corrigé dans mon script. Votre Démonstration fonctionne parfaitement, mais malheureusement, j'ai essayé toute la matinée, de combiner mon Url et d'accompagnement des attributs avec la démo de code et vous avez beaucoup de fait un gâchis. Il semble que je dois insérer l'Url etc. après: les popups.push(open(", mais qui ne fonctionne pas. Pouvez-vous me montrer où je place ce code? Aussi j'apprécie la pointe sur upvoting. Je suis nouveau ici et je ne savais pas à ce sujet.

    OriginalL'auteur Hashbrown