Em uma página com moldura de múltiplas janelas, é comum a interação de informações entre subjanelas. Se você clicar em um hiperlink na janela de navegação, como abrir a página vinculada em outra janela? Se eu pressionar um botão nesta janela, posso escrever uma mensagem em outra janela? São tantas janelas, como identificá-las? Por favor, veja o exemplo abaixo.
1. Clique no link na janela de navegação para abrir a página da web em outra janela
A página de um quadro existente é mostrada na imagem acima. A janela A é o logotipo e o anúncio do site, a janela B é a barra de navegação e a janela C é a janela que exibe a página. O código fonte desta página emoldurada é:
| <framesetrows=20%,*> <framename=topFramescrolling=NOnoresizesrc=toppage.htm> <framesetcols=18%,*> <framename=leftFramenoresizesrc=leftpage.htm> <framename=mainFramesrc=mainpage.htm> </frameset> </frameset> |
Se for necessário que a página vinculada (test.htm) na janela B seja aberta na janela C, então o link na janela B deverá ser escrito da seguinte forma: <a herf=test.htm target=mailFrame> A página deste link deve ser aberto na janela C. </a>, a função principal aqui é o parâmetro target na tag <A> Se você deseja abrir a página da web nessa janela, defina o nome dessa janela no parâmetro Target.
2. Pressione um botão na janela B e escreva uma linha de texto na janela C.
O formato da página deste exemplo é o mesmo do exemplo anterior. O efeito finalizado é o seguinte: Após pressionar o botão "Escrever na Janela C" na janela B, uma linha de texto "Olá! Olá! Isto é através de Palavras escritas para. Controle de janela B." O código da página emoldurada e dos arquivos da página da web em cada janela é igual ao exemplo acima.
Método de preparação:
1. Insira o seguinte programa Javascript entre o código fonte <head> e </head> da página web da janela C (mainpage.htm):
| <scriptlinguagem=Javascript> <!-- teste de função(){ document.write(Olá! Olá! Esta é uma palavra escrita através do controle da janela B.) } --> </script> |
A função deste programa é escrever um texto na janela atual.
2. Então, como chamar o programa da janela C na janela B? Primeiro, observe o código-fonte do botão "Escrever na janela C" na janela B:
| <inputtype=buttonvalue=Escrever na janela C onclick=parent.mainFrame.htest()> |
Neste código, a chave é o código "parent.mainFrame", que introduz um novo conceito - relacionamento estrutural de janelas, ou seja, em uma página multijanelas, o relacionamento entre janelas é determinado por quais princípios. O princípio para determinar o relacionamento da janela é: a janela dividida da janela atual é a "janela filha" (filhos) da janela atual, então a janela atual é a "janela pai" (pai) da janela dividida. Por exemplo, a relação entre as janelas neste exemplo é a seguinte:
Como pode ser visto na tabela acima, a "janela do navegador" é a "janela pai" de "topFrame" e "janela inferior", e a janela inferior é a "janela pai" das duas janelas "leftFrame" e "mainFrame ". A conexão entre as duas janelas deve ser através de suas janelas pai, portanto, neste exemplo, para chamar "htest()" na página web na janela C, é obviamente através dos pais de C e B e depois para o mainFrame, e então chame o programa htest().
Então, se o código para escrever texto na janela C para a janela B for assim: onclick=parent.leftFrame.htest(); ? A propósito, é isso: onclick=grandchildren.mainFrame.htest().
Como pode ser visto no exemplo acima, a questão principal na troca de informações entre janelas é compreender a relação entre janelas, e outras operações são relativamente simples.