[Resolvido] Executar duas funções javascript ao carregar a página

Nukes · Novembro 20, 2011

Galera, o que acontece é o seguinte...

Criei uma página usando um plugin, estou usando o plugin pra abrir um menu e um sub-menu... jquery para usar menu com "Tabs"...

O menu1 abre o menu2 que abre o conteúdo

Mais ou menos assim

------- Link1 ---------------- Link2 ----------------- Link3 -------

\/ \/ \/

-Sublink1--Sublink1-----Sublink2----Sublink2----Sublink3----Sublink3--

\/ \/ \/ \/ \/ \/

Conteudo -- Conteudo -- Conteudo -- Conteudo -- Conteudo -- Conteudo

O problema é o seguinte, na hora que a página é aberta, a página inicial deve estar dentro da div (para que o usuário não precise clicar em "Página Inicial" para abri-la...

E para isso, preciso executar duas funções javascript (makeactive(1) e makeactivecontent(1)) após a página ser carregada.

Tentei colocar no <body onLoad="makeactive(1), makeactivecontent(1)"> porém só carrega a função que está por primeira.

Tentei colocar no <body onload="makeactive(1)"> e no final colocar uma função window.onload() para carregar a makeactivecontent(1)... porém a função não funciona direito (fica só carregando e não mostra o conteudo)...

Já não sei mais o q fazer ,alguem tem alguma solucao?

Obrigado,

Abraços

Henrique Barcelos · Novembro 20, 2011

Primeiro: não utilize esses atributos do HTML para executar funções Javascript, você está misturando camadas, tornando o Javascript obstrusivo.

Dentro da tag HEAD do HTML coloque assim:

<script type="text/javascript">
window.onload = function(){
makeactive(1); 
makeactivecontent(1);
}
</script>

Nukes · Novembro 20, 2011

Primeiro: não utilize esses atributos do HTML para executar funções Javascript, você está misturando camadas, tornando o Javascript obstrusivo.

Dentro da tag HEAD do HTML coloque assim:
<script type="text/javascript">
window.onload = function(){
makeactive(1); 
makeactivecontent(1);
}
</script>

Poisé, eu tinha tentando isso também, mas por algum motivo também não está funcionando?

Será um problema com a função?

Vou postar o código aqui...

makeactive:

function makeactive(tab) { 
document.getElementById("tab1").className = "";
document.getElementById("tab2").className = "";
document.getElementById("tab3").className = ""; 
document.getElementById("tab"+tab).className = "active";
callAHAH('header.php?header= '+tab, 'header', '<center><img src="imgs/loading.gif" style="margin-top: -40px;"></center>', 'Erro ao carregar a página.'); 
}

makeactivecontent:

function makeactivecontent(tab) { 
document.getElementById("icon1").className = ""; 
document.getElementById("icon2").className = "";
document.getElementById("icon"+tab).className = "active_cont img";
callAHAH('content.php?content= '+tab, 'conteudo', '<center><img src="imgs/loading.gif" style="margin-top: -40px;"></center>', 'Erro ao carregar a página.'); }

callAHAH:

function callAHAH(url, pageElement, callMessage, errorMessage) {
    document.getElementById(pageElement).innerHTML = callMessage;
    try {
    req = new XMLHttpRequest(); /* e.g. Firefox */
    } catch(e) {
      try {
      req = new ActiveXObject("Msxml2.XMLHTTP");  /* some versions IE */
      } catch (e) {
        try {
        req = new ActiveXObject("Microsoft.XMLHTTP");  /* some versions IE */
        } catch (E) {
         req = false;
        } 
      } 
    }
    req.onreadystatechange = function() {responseAHAH(pageElement, errorMessage);};
    req.open("GET",url,true);
    req.send(null);
 }

function responseAHAH(pageElement, errorMessage) {
  var output = '';
  if(req.readyState == 4) {
     if(req.status == 200) {
        output = req.responseText;
        document.getElementById(pageElement).innerHTML = output;
        } else {
        document.getElementById(pageElement).innerHTML = errorMessage+"\n"+output;
        }
     }
 }

E os arquivos .php que estão tudo ok...

O estranho é que se eu clico na aba 1 ela abre normalmente... Só quando chama a função no onLoad que não carrega uma das duas...

=/

Henrique Barcelos · Novembro 20, 2011

Verifique o console do seu navegador por erros.

Recomendo que leia:

:seta: http://wbruno.com.br/blog/2011/03/31/como-debugar-javascript-firefox-erros-comuns/

Nukes · Novembro 21, 2011

Verifique o console do seu navegador por erros.

Recomendo que leia:

:seta: http://wbruno.com.br/blog/2011/03/31/como-debugar-javascript-firefox-erros-comuns/

Nenhum erro importante, apenas algumas falhas de CSS =/

Desde sexta-feira já com esse problema, e não consigo resolver! :|

Buongiorno · Novembro 23, 2011

Olá Camarada, tudo bem?

Imagino que possa estar acontecendo o seguinte, na função "makeactive" você fez uma chamada para a função "callAHAH" que irá criar o objeto "req", que é usado depois na função "responseAHAH" para tratar o retorno do ajax. Entretanto, antes que esse retorno aconteça a função "makeactivecontent" já foi chamada e ela faz uma nova chamada para a função "callAHAH" que irá recriar/alterar o objeto "req" que não mais servirá para o retorno da primeira função.

Até mais.

Nukes · Novembro 25, 2011

Olá Camarada, tudo bem?

Imagino que possa estar acontecendo o seguinte, na função "makeactive" você fez uma chamada para a função "callAHAH" que irá criar o objeto "req", que é usado depois na função "responseAHAH" para tratar o retorno do ajax. Entretanto, antes que esse retorno aconteça a função "makeactivecontent" já foi chamada e ela faz uma nova chamada para a função "callAHAH" que irá recriar/alterar o objeto "req" que não mais servirá para o retorno da primeira função.

Até mais.

Eu até imaginei isso, mas tentei criar duas novas funções iguais, com outro nome, só pra fazer a chamada e testes.

Criei a função CallAHAH2 e responseAHAH2 ... Aí a função makeactivecontent(1) ao invés de chamar o CallAHAH chamava o CallAHAH2 que por sua vez chamava o responseAHAH2...

Porém mesmo assim não funcionou =/.

Tem alguma idéia?

Tentei também usar o "When" do Jquery pra somente executar a função depois que a primeira estivesse finalizada... Também não funcionou :(

Não sei mais o que fazer, mais de uma semana nesse problema :|

Buongiorno · Novembro 25, 2011

que irá recriar/alterar o objeto "req" que não mais servirá para o retorno da primeira função.

Criei a função CallAHAH2 e responseAHAH2 ... Aí a função makeactivecontent(1) ao invés de chamar o CallAHAH chamava o CallAHAH2 que por sua vez chamava o responseAHAH2...

Não adianta pois criar duas funções se ambas possuem um objeto com o mesmo nome "req". Experimente mudar o nome do objeto para "req2" nas funções "CallAHAH2" e "responseAHAH2" para ver o que acontece.

Até mais.

Buongiorno · Novembro 26, 2011

Olá Camarada, tudo bem.

O problema de se usar duas funções ajax, ex. "CallAHAH" e "CallAHAH2", é que pode acontecer de uma função que foi chamada por último acabe completando antes de outra que foi chamada primeiro, ex. makeactivecontent" ser executada antes de "makeactive".

Deixar o ajax no modo síncrono deve resolver o problema neste caso. Somente quando uma requisição for completada é que uma nova poderá ser processada, isso fará com que as duas funções "makeactive" e makeactivecontent" funcionem, uma após outra.

O problema do sincronísmo é que o processamento do javascript ficará "travado" aguardando o ajax terminar/completar as requisões e isso pode tornar-se um incoveniente muito grande, principalmente quando há muita demora na resposta do servidor para o ajax.


function callAHAH(url, pageElement, callMessage, errorMessage)
{
document.getElementById(pageElement).innerHTML = callMessage;
var req = false;
try
{
	req = new XMLHttpRequest(); // e.g. Firefox 
}
catch(e)
{
	try
	{
		req = new ActiveXObject("Msxml2.XMLHTTP");  // some versions IE 
	}
	catch (e)
	{
		try
		{
			req = new ActiveXObject("Microsoft.XMLHTTP");  // some versions IE 
		}
		catch (E)
		{
			req = false;
		} 
	} 
}
if(!req){alert("O seu navegador não suporta AJAX!");return}

//req.open("GET",url,true); // true assíncrono
req.open("GET",url,false); // false síncrono
req.send(null);

req.onreadystatechange = function()
{
	if (req.readyState==4)
	{
		if (req.status==200)
		{
			document.getElementById(pageElement).innerHTML = req.responseText;
		}
		else
		{ 
			document.getElementById(pageElement).innerHTML = errorMessage+"\n"+req.responseText;
		}
	}
};
}

Até mais.

Nukes · Novembro 27, 2011

Olá Camarada, tudo bem.

O problema de se usar duas funções ajax, ex. "CallAHAH" e "CallAHAH2", é que pode acontecer de uma função que foi chamada por último acabe completando antes de outra que foi chamada primeiro, ex. makeactivecontent" ser executada antes de "makeactive".

Deixar o ajax no modo síncrono deve resolver o problema neste caso. Somente quando uma requisição for completada é que uma nova poderá ser processada, isso fará com que as duas funções "makeactive" e makeactivecontent" funcionem, uma após outra.

O problema do sincronísmo é que o processamento do javascript ficará "travado" aguardando o ajax terminar/completar as requisões e isso pode tornar-se um incoveniente muito grande, principalmente quando há muita demora na resposta do servidor para o ajax.

Até mais.

Tentei com o script que o Buongiorno postou, mas também não funcionou, fica carregando e não sai disso.

O que eu reparei que pode estar acontecendo é o seguinte...

A função makeactive, mostra o conteudo do header (link1, link2, link3, etc...) e a funcao makeactivecontent mostra o conteudo do link1...

Então oq pode estar acontecendo é que os objetos do header ainda não existem até que a funcao makeactive seja executada e a funcao makeactivecontent depende dos objetos do header...

Só acho estranho que eu mando primeiro executar a makeactive e depois a makeactivecontent... Mas não dá certo de jeito nenhum..

Tentei também mudar o nome de todas as variaveis para variavel2 por exemplo... A função funciona quando é executada no onclick (quando eu clico no objeto do header, mostra o conteudo)... mas no OnLoad não funciona de jeito nenhum, aparece somente os objetos do header :S

AHHHHH to quase desistindo.

abraços

HOHOHOO!

Logo depois que enviei a ultima mensagem, dei um refresh e FUNCIONOU!

Enfim, o que fiz foi mudar os nomes das funções e das variáveis!

Obrigado por todas as respostas galera! Se não fosse vcs eu teria desistido bem antes!

Abraços!

Arquivado

[Resolvido] Executar duas funções javascript ao carregar a página

Recommended Posts

Nukes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Henrique Barcelos 290

Compartilhar este post

Link para o post

Compartilhar em outros sites

Nukes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Henrique Barcelos 290

Compartilhar este post

Link para o post

Compartilhar em outros sites

Nukes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Buongiorno 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Nukes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Buongiorno 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Buongiorno 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Nukes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante