Eu recebi um montão de mails sobre o problema de como duas páginas podem ser carregadas
com somente um clique do mouse. Basicamente, existem três soluções diferentes para esse
problema. A primeira possibilidade é criar um botão que convoque uma função quando o
usuário o pressionar. Esta função deve carregar duas páginas em frames diferentes ou
abrir novas janelas. Isto não vai parecer tão difícil se você der uma olhada nos
exemplos dados nas outras partes desta introdução. Nós já temos aqui tudo o que
precisamos.
Nós criamos três frames. O primeiro é utilizado para o botão. A primeira página HTML é necessária somente para a abertura dos frames e para nomeá-los. Nada disso é novidade, pois nós já usamos esta técnica na Parte 3 para trabalhar com frames, mas, de qualquer modo, eu vou fazer a demonstração. (Eu não sei se isto acontece com você também, mas toda vez que um autor de livros de informática imagina que alguma coisa não precisa ser publicada por ser muito fácil, esta é precisamente a parte com a qual ele tem mais problemas; mas, vamos lá:)
<HTML>
<HEAD>
<title>Frames</title>
</HEAD>
<FRAMESET COLS="295,*">
<FRAMESET ROWS="100%,*">
<FRAME SRC="loadtwo.htm" NAME="fr1">
</FRAMESET>
<FRAMESET ROWS="75%,25%">
<FRAME SRC="cell.htm" NAME="fr2">
<FRAME SRC="cell.htm" NAME="fr3">
</FRAMESET>
</FRAMESET>
</HTML>
loadtwo.htm é carregado no primeiro frame. Este é o frame que tem o botão.
<HTML>
<HEAD>
<script language="JavaScript">
<!-- Hiding
function loadtwo(page2, page3) {
parent.fr2.location.href=page2;
parent.fr3.location.href=page3;
}
// -->
</script>
</HEAD>
<BODY>
<FORM NAME="buttons">
<INPUT TYPE="button" VALUE="2 em uma linha" onClick="loadtwo('frtest1.htm','frtest2.htm')">
</FORM>
</BODY>
</HTML>
A função loadtwo() é convocada quando o botão é pressionado. Duas seqüências são colocadas na função. Se você olhar na função loadtwo() verá que o segundo frame fr2 carrega a página que é definida pela primeira seqüência na chamada da função. Se você tiver botões diferentes abrindo páginas diferentes, você pode reutilizar esta função. A única coisa que se tem que fazer é colocar as URLs (endereços) das diferentes páginas na função.
A segunda técnica lança mão de hiperlinks. Alguns exemplos navegando pela Internet têm
alguma coisa parecida com:
<a href="yourlink.htm onCLick="yourfunction()">
Mas essa técnica aparentemente não funciona em todas as plataformas, assim o melhor é
não usá-la. Além do mais eu não estou nem seguro de que ela sequer funcione, afinal de
contas. Mas não temos que nos preocupar com isso porque existe outro método pelo qual
podemos implementar o que queremos. Nós podemos declarar uma função JavaScript do
seguinte modo:
<a href="javascript:myfunction()">Meu Link</a>
Isso é realmente muito fácil e parece funcionar bem em todos os browsers. Basta escrever javascript: e em seguida o nome da sua função dentro de um link. Se você declarar a função 'loadtwo()' do exemplo acima, poderá atualizar dois frames com um único clique do mouse sobre um hiperlink.
A terceira técnica para carregar duas páginas com um clique de mouse pode ser a
combinação de dois botões ou de hiperlinks normais. Nós poderíamos fazer isso
através da segunda técnica demonstrada acima, mas essa abordagem daqui parece ser
algumas vezes mais apropriada. O que se pode fazer é carregar uma página HTML
em um frame, assim:
<a href="getfr2.htm" target="fr2">Clique aqui!</a>
Mas nós já conhecemos isto. O que há de novo é o acréscimo da propriedade onLoad
no arquivo carregado. Por isso o arquivo getfr2.htm ficaria assim:
<HTML> <BODY onLoad="parent.fr3.location.href='getfr3.htm'; return true;"> bla bla bla </body> </html>
Logicamente, você tem que acrescentar isso a todos os documentos que forem carregados no segundo frame.
Outro problema já visto é o de
como podem ser carregadas novas páginas em uma nova janela. A janela se abrirá quando o
usuário clica num link. Você só terá que acrescentar a propriedade target no seu
tag (descritor) novamente. Isso ficaria assim:
<a href="vaiondequiser.html" target="Janela
Adicional">Vá!</a>
Agora vamos dar uma olhada nos diferentes operadores que podem ser usados no JavaScript. Os Operadores são uma técnica poderosa para encurtar e melhorar o seu script. Se você quisesse testar por exemplo se uma variável x é maior do que 3 e menor do que 10, você poderia escrever desse modo:
if (x>3)
if (x<10)
doanything();
A função doanything() seria convocada se x>3 e x<10. Mas existe um modo mais rápido de se escrever isto:
if (x>3 && x<10) doanything();
O && é chamado de operador E. Existe também o operador OU. Você pode usar isso por exemplo, se quiser constatar se uma variável x é igual a 5 ou outra variável y é igual a 17:
if (x==5 || y==17) doanything();
A função doanything() será
convocada quando x==5 ou y==17. Ela também será convocada se ambas as
comparações forem verdadeiras.
As comparações se fazem através do operador == no JavaScript (Naturalmente também
existe <,>,<= e >=). Se você conhece C/C++, é a mesma coisa. Um único = é
usado para armazenar um valor numa variável. (Se você conhece Pascal isso pode parecer
um pouco confuso, porque assignar valores a variáveis em Pascal se faz através de := e
comparações através de um único =). Se vopcê quiser ver se uma variável não é
igual a um certo número, isso pode ficar um pouco complicado sem os operadores. Isto
poderia ser feito com um único !=. Veja só o exemplo: x != 17. Existem muitos
outros operadores que podem fazer suas programações de maneira mais eficiente. Dê uma
olhada na documentação fornecida pela Netscape para ter o panorama completo de todos os
operadores que se podem usar em JavaScript.