Benötigen Sie eine eindeutige ID in Javascript für Registerkarten und für neue Fenster in Internet Explorer

Question

Benötigen Sie einen einfachen Ansatz, um eine eindeutige ID in Javascript für Registerkarten in Internet Explorer zu erhalten. Ich habe mich im Grunde genommen gefragt, ob da etwas wie document.tab.indexnumber ist, was es nicht gibt. Die eigentliche Frage ist also, ob es irgendetwas gibt, was man dazu nutzen kann, um das zu generieren oder um herauszufinden, in welchem ​​Tab du bist? Ähnlich sollte ich in der Lage sein, eine andere eindeutige ID für eine andere Instanz von Internet Explorer zu bekommen?
Ich kann ein IE-Addon dafür nicht verwenden.

Eine zusätzliche Komplikation ist, dass wir einen Zufallszahlengenerator plus Zeitstempel für eine eindeutige ID verwenden könnten, wie unten in einer der Antworten vorgeschlagen. Aber wie kann ich dieselbe Nummer für dieselbe Registerkarte in derselben Sitzung beibehalten? Wenn ich es in einer Sitzungsvariablen speichere, wird es zwischen allen Tabs/Fenstern mit dieser Sitzung geteilt.

Wir könnten die ID in die URL oder ein verstecktes Feld setzen, aber diese Lösung wäre zu aufdringlich für das Design der Website. Auf der Suche nach etwas weniger aufdringlich.

Answer 1

Ich arbeite in einer benutzerdefinierten Session-Klasse für das ASP.Net-Framework (sowohl WebForms und MVC Aromen).

Obwohl sehr alt, ist diese Frage sehr relevant und ich konnte keine andere Adressierung des Problems finden.

Daher teile ich die Lösung ich codiert, um eine eindeutige und dauerhafte GUID für jedes Fenster und/oder Registerkarte zu gewährleisten, statisch und gesichert, egal wie hart man aktualisiert, navigiert außerhalb der Website und kehrt zurück, reinigt den Cache usw .

Die Magie beinhaltet window.name und ist durch den folgenden JavaScript-Code implementiert. Der Bootstrap basiert auf jQuery, kann aber problemlos in jQuery-lose Lösungen übertragen werden.

Beachten Sie, dass diese GUID automatisch an vorhandene form Server-seitige Referenzen angehängt wird.

---

UIGUID.js

---

Edited: die Originalversion gab einen Fehler bei windowLoadSetGUIDOnForms für formList.length == 1

//------------------------------------------------------------------------------ 
//-- guarantees that window.name is a GUID, and that it would 
//-- be preserved whilst window life cicle 
//-- 
//-- for frames and iframes, the outermost window determines the GUID 
//-- 
//-- for every form it will be appended a hidden element of id 
//-- "this.window.GUID" for server-side references 
//------------------------------------------------------------------------------ 
//-- window.name will be set to "GUID-<A_GUID>" 
//------------------------------------------------------------------------------ 

//------------------------------------------------------------------------------ 
//-- Retrieves window GUID, initializing it if necessary ----------------------- 
//------------------------------------------------------------------------------ 

function getWindowGUID() { 
    //---------------------------------- 
    var windowGUID = function() { 
     //---------- 
     var S4 = function() { 
      return (
        Math.floor(
          Math.random() * 0x10000 /* 65536 */ 
         ).toString(16) 
       ); 
     }; 
     //---------- 

     return (
       S4() + S4() + "-" + 
       S4() + "-" + 
       S4() + "-" + 
       S4() + "-" + 
       S4() + S4() + S4() 
      ); 
    }; 
    //---------------------------------- 

    //-- traverses up in the hierarchy for the outermost window ---------------- 

    var topMostWindow = window; 

    while (topMostWindow != topMostWindow.parent) { 
     topMostWindow = topMostWindow.parent; 
    } 

    //-- initialize GUID if needed --------------------------------------------- 

    if (!topMostWindow.name.match(/^GUID-/)) { 
     topMostWindow.name = "GUID-" + windowGUID(); 
    } 

    //-- return GUID ----------------------------------------------------------- 

    return topMostWindow.name; 
} //-- getWindowGUID ----------------------------------------------------------- 

//------------------------------------------------------------------------------ 
//-- Append via jQuery handlers for windowLoad --------------------------------- 
//------------------------------------------------------------------------------ 

$(window).load(
    function() { 
     windowLoadSetGUID(); 
     windowLoadSetGUIDOnForms(); 
    } 
) //---------------------------------------------------------------------------- 

function windowLoadSetGUID() { 
    var dummy = getWindowGUID(); 
} //-- windowLoadSetGUID ------------------------------------------------------- 

function windowLoadSetGUIDOnForms() { 
    var formList = $('form'); 
    var hidGUID = document.createElement("input"); 

    hidGUID.setAttribute("type", "hidden"); 
    hidGUID.setAttribute("name", "this.window.GUID"); 
    hidGUID.setAttribute("value", getWindowGUID()); 

    if (formList.length == 1) { 
     formList.append(hidGUID); 
    } 
    else { 
     for (var i = 0; i < formList.length; ++i) { 
      formList[i].append(hidGUID); 
     } 
    } 
} //-- windowLoadSetGUIDOnForms ------------------------------------------------ 

Als POC, entwickelte ich zwei HTML-Skripten demonstriert die Einzigartigkeit auch bei Kindelementen in Frames oder iFrames

---

GUIDTest.html

---

<html> 
    <head> 
    <script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
    <script language="javascript" type="text/javascript" src="UIGUID.js"></script> 
    </head> 
    <body onLoad="alert('Main document: ' + getWindowGUID());"> 
    <iframe id="frame001" src="GUIDFrame.html"></iframe> 
    <iframe id="frame002" src="GUIDFrame.html"></iframe> 
    </body> 
</html> 

---

GUIDFrame.html

---

<html> 
    <head> 
    <script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
    <script language="javascript" type="text/javascript" src="UIGUID.js"></script> 
    </head> 
    <body onLoad="alert('iFrame: ' + getWindowGUID());" /> 
</html>