Come posso archiviare e accedere a un valore su una madre di iFrame utilizzando jQuery?

Question

Ho un sito web che è composto da una pagina padre. Usando lo stile lightbox plugin jQuery colorbox apro altre pagine iFrame che galleggiano sulla parte superiore della pagina padre, lo stile di sovrapposizione.

Nel codice javascript nelle pagine iFrame passo per caricare i dati JSON da Facebook. Dal momento che il caricamento dei dati da Facebook richiede tempo che voglio per memorizzare i dati che ho caricato in una variabile che vive sulla pagina padre.

Poi, ogni volta che apro un nuovo iFrame in un overlay, voglio essere in grado di verificare se la variabile pagina padre è vuota o non. Se è vuoto, ho caricare i dati da Facebook. Se non è vuoto, ottengo i dati dalla variabile sulla pagina padre.

L'unico motivo che voglio fare questo sta aumentando le prestazioni ed evitando inutili chiamate alle API di Facebook.

Come faccio a creare una soluzione in cui un javascript in un iFrame in grado di memorizzare e l'accesso ai dati da una variabile che vive sulla sua pagina padre?

Non ho il codice vero e proprio, ma in pseudo-codice Mi piacerebbe qualcosa di simile:

function loadFacebookFriends() {
   if(parentFriendsVariable is empty) {
      Load friends from Facebook
   }
   else {
      localFriendsVariable = parentFriendsVariable
   }
}

L'invito agli sguardi API di Facebook in questo modo:

FB.api("/me/friends?fields=name,first_name,picture", function(friendsData) {
    // When this callback is executed, the data I want is
    // now in the object:
    friendsData.data
});

Nella pagina padre mio codice javascript è in un tag pronto documento jQuery.

Grazie in anticipo!

/ Thomas Kahn

Answer 1

ho risolto il problema. La vera fonte di esso non stava accedendo alla variabile, ma un errore nel modo in cui e quando ho accesso al variabili nel mio javascript. Quando ho dichiarato le variabili al di fuori di jQuery nella pagina padre, in questo modo:

   var friendsCache = new Object;

... ha funzionato! Nella mia pagina IFrame posso accedere al valore in questo modo:

   var friends = window.parent.friendsCache;

Così ora ho una soluzione che sembra qualcosa di simile. Quando l'utente si è connesso con successo con Facebook Connect, che io chiamo i loadFriends funzione:

function loadFriends() {
   if (jQuery.isEmptyObject(friends)) {
      FB.api("/me/friends?fields=name,first_name,picture", renderFriends);
   }
   else {
      renderFriends();
   }
}

function renderFriends(friendsData) {
   if (friendsData != undefined) {
      if (!(jQuery.isEmptyObject(friendsData))) {
         friends = friendsData.data;
         window.parent.friendsCache = friends;
      }
   }
   // Do the stuff you want to do when the friends are loaded
}

Fino a quando la pagina principale non viene ricaricato, non ho bisogno di caricare la lista di amici di Facebook dal Graph API. Invece io caricarli dal mio variabile cache, che mi dà un aumento altamente notevole delle prestazioni.

Benche 'questa descrizione era un po' più ampia rispetto la mia domanda iniziale, spero che qualcuno lo troverà utile.

/ Thomas Kahn