2014-07-07 9 views
5

Załóżmy, otworzyć kilka okien z:JavaScript: Jak uzyskać listę wszystkich otwartych okien

window.open(url1,'win1'); 
    window.open(url2,'win2'); 
    window.open(url3,'win3'); 

(każde okno ma swoją unikalną nazwę)

A następnie odśwież stronę.

3 okna podręczne są nadal otwarte. Czy istnieje sposób na wylistowanie nazw wszystkich otwartych okien i ich zamknięcie?

To nie jest duplikat pytania.

W tym pytaniu przeglądarka jest odświeżana, więc nie można po prostu użyć globalnej tablicy do śledzenia okien potomnych.

To nie jest duplikat pytania.

+0

No nie ma, chyba że adresy URL są z tej samej domeny. Niż może istnieć możliwość komunikacji między tymi oknami, ale nie sądzę, że można je programowo zamknąć, ponieważ utracono odniesienie do okien. –

+0

Adresy URL znajdują się w tej samej domenie. –

+1

Następnie mogli napisać do localStorage, zgodnie z sugestią [tutaj] (http://stackoverflow.com/q/2236828/218196). Może mieć okna potomne słuchać zmian i mieć je zamknąć się. –

Odpowiedz

4

Więc pytania są zamknięte, opublikuję odpowiedź na podstawie komentarzy i badań.

Po pierwsze, wszystkim, którzy skomentowali, dziękuję za pomoc.

Odpowiedź: Brak wbudowanego obiektu, który śledzi otwarte okna i nie zmienia się po załadowaniu strony do załadowania strony.

Jak zauważył Felix Kling, używanie localStorage to możliwość obejścia.

1

Spróbuj postMessage do komunikacji między istniejącymi oknami w tej samej domenie. W ten sposób spróbuję rozwiązać ten sam problem. Zobacz: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

index.htm

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>pop</title> 
    </head> 
    <body> 

    <script> 

var pops = []; 

window.onmessage = function(e) 
{ 

    // todo: check domain 
    // if(e.origin) 
    var data; 
    try 
    { 
     data = JSON.parse(e.data); 
    } 
    catch(e) 
    { 
     // fail silent...? 
     return; 
    } 
    switch(data.event) 
    { 
    case "RestoreOpenWindow": 
     onClosePopup(e.source.name); 
    case "QueryOpenWindows": 
     pops.push(e.source); 
     updateLabel(); 
     break; 
    } 
}; 

window.onload = function() 
{ 
    window.onClosePopup = onClosePopup; 
    updateLabel(); 
}; 

window.onbeforeunload = function() 
{ 
    for(var i = 0; i < pops.length; i++) pops[i].queryOpenPopups(); 
}; 

function onClosePopup(name) 
{ 
    for(var i = pops.length - 1; i >= 0; i--) 
     if(pops[i].name === name) 
      { pops.splice(i, 1); break; } 
    updateLabel(); 
}; 

function openPopup() 
{ 
    pops.push(window.open("pop/popup.htm", "pop" + pops.length, ' ')); 
    updateLabel(); 
    setTimeout(function(){ 
     alert('Click ok to refresh...'); 
     location.href = location.href; 
    }, 5000); 
} 

function updateLabel() 
{ 
    document.getElementById("total").innerHTML = pops.length; 
    var html = []; 
    for(var i = 0; i < pops.length; i++) 
     html.push(pops[i].name); 
    document.getElementById("names").innerHTML = html.join("<br"+"/"+">"); 
} 


    </script> 
    <button onclick="openPopup()">open popup and refresh after 5 seconds (...allow em popups...)</button></br> 
    <span>total: </span><span id="total"></span></br> 
    <span id="names"></span></br> 
    </body> 
</html> 

popup.htm

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>pop</title> 
    </head> 
    <body> 

    <script> 

window.queryOpenPopups = function() 
{ 
    var count = 0; 
    var hInterval = setInterval(function() { 
     try 
     { 
      if(window.opener) 
      { 
       window.opener.postMessage(JSON.stringify({"event": "QueryOpenWindows", "name": window.name}), "*"); 
       clearInterval(hInterval); 
      } else count++; 
     } 
     catch(e) 
     { 
      count++; 
     }  
     if(count > 50)window.close(); 
    }, 100); 
}; 

window.onbeforeunload = function(){ 
    window.opener.onClosePopup(window.name); 
}; 

// restore link with opener on refresh 
window.opener.postMessage(JSON.stringify({"event": "RestoreOpenWindow", "name": window.name}), "*"); 

window.onload=function(){ document.getElementById("name").innerHTML = window.name; }; 
    </script>  
    <span id="name"></span> 
    </body> 
</html>