Como faço para armazenar e acessar um valor em um iFrame pai usando jQuery?

Question

Eu tenho um site que consiste de uma página principal.Usando o lightbox-estilo-plugin de jQuery colorbox que eu abrir outras páginas iFrames que flutuam no topo da página principal, sobreposição de estilo.

No código javascript no iFrame páginas que eu carga de dados JSON a partir do Facebook.Desde o carregamento de dados do facebook, leva o tempo que eu precisava para armazenar os dados que eu tenho carregado em uma variável que vive na página principal.

Em seguida, cada vez que eu abrir um iFrame de novo em uma sobreposição, eu quero ser capaz de verificar se a página principal variável está vazia ou não.Se está vazio, eu carregar os dados do Facebook.Se não é vazio, eu obtenha os dados da variável na página principal.

A única razão de eu querer fazer isso é aumentar o desempenho e evitar chamadas desnecessárias para o Facebook API.

Como faço para criar uma solução onde um javascript em um iFrame pode armazenar e acessar dados de uma variável que vive em sua página principal?

Eu não tenho o código real, mas em pseudo-código que eu gostaria de algo como isto:

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

A chamada para o Facebook API parecido com este:

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
});

Na página principal do meu código javascript é em jQuery documento pronto marca.

Obrigado antecipadamente!

/Thomas Kahn

Answer 1

Eu ter resolvido o problema.A verdadeira fonte não estava acessando a variável, mas um erro em como e quando tive acesso a variáveis na minha javascript.Quando eu declaradas as variáveis fora do jQuery na página principal, como este:

   var friendsCache = new Object;

...funcionou!Na minha IFrame página que eu possa acessar o valor como este:

   var friends = window.parent.friendsCache;

Então agora eu tenho uma solução que parece ser algo como isto.Quando o usuário estiver conectado com êxito com Facebook Connect, eu chamo a função loadFriends:

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
}

Enquanto o pai de página não é recarregada, eu não preciso carregar a lista do Facebook de amigos da Graph API.Em vez disso, eu carregá-los a partir do meu cache variável, o que me dá altamente aumento considerável no desempenho.

Embora esta descrição foi um pouco mais abrangente do que a minha pergunta original, espero que alguém vai achar que é útil.

/Thomas Kahn