Jump to content


Problemas No Getelementbytagname Com Innerhtml


  • Faça o login para participar
8 replies to this topic

#1 Whitesnake

Whitesnake
  • Visitantes

Posted 18/12/2005, 16:31

E ae pessoal!
Bem galera, o motivo da minha presença aqui é que estou fazendo alguns testes com cgi + ajax, e surgiu o seguinte problema.
Estou o usando o seguinte código para capturar os links da página (mais especificamente os do menu) pra depois trabalhar com o ajax em cima:
           //Obtém os links do menu
            var links=document.getElementsByTagName("a")

Até ai tudo bem, não há problemas, o script esta funcionando normal, adicionando o conteúdo de acordo com a escolha no menu, com a função innerHTML:
           //Exibe o texto no div conteúdo
            var conteudo=document.getElementById("conteudo")
            conteudo.innerHTML=texto

Funciona certinho, mas o problema é que, se a variável texto tiver algum link em seu conteudo, que este seja uma subseção ou qualquer link interno, este não é reconhecido pela função getElementsByTagName.
Creio que é porque ela lê apenas os links da página inicial, ou seja, o menu... Então a pergunta que surge é:
O que devo fazer pra que este reconheça os links que serão incluidos mais tarde no conteúdo!?

Obrigado desde já!
Fui!

#2 Alex Hiroshi

Alex Hiroshi

    Super Veterano

  • Ex-Admins
  • 4923 posts
  • Sexo:Masculino
  • Localidade:São Paulo - SP

Posted 19/12/2005, 09:08

A função que está o getElementsByTagName() é chamada no onload? Exemplo...
<script>
window.onload=function(){
linkss = document.getElementsByTagName("a");
	for(i=0;i<linkss.length;i++){
  linkss.item(i).onclick=function(){
  alert("oi");
  }
	}
}
</script>

Fórum WMO - Equipe de Desenvolvimento / Banco de Dados - Ex-Administrador

#3 Whitesnake

Whitesnake
  • Visitantes

Posted 19/12/2005, 19:34

Exato! Confira o script, isso que você disse está nas últimas linhas:

try{
    xmlhttp = new XMLHttpRequest();
}catch(ee){
    try{
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    }catch(e){
        try{
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }catch(E){
            xmlhttp = false;
        }
    }
}


atual=0
function carrega(n){

    //Exibe o texto carregando no div conteúdo
    var conteudo=document.getElementById("conteudo")
    conteudo.innerHTML='<div class="carregando">carregando...</div>'

    //Guarda a página escolhida na variável atual
    atual=n

    //Abre a url
    xmlhttp.open("GET", "funcoes.cgi?"+n,true);

    //Executada quando o navegador obtiver o código
    xmlhttp.onreadystatechange=function() {

        if (xmlhttp.readyState==4){

            //Lê o texto
            var texto=xmlhttp.responseText

            //Desfaz o urlencode
            texto=texto.replace(/\+/g," ")
            texto=unescape(texto)

            //Exibe o texto no div conteúdo
            var conteudo=document.getElementById("conteudo")
            conteudo.innerHTML=texto

            //Obtém os links do menu
            var menu=document.getElementById("menu")
            var links=document.getElementsByTagName("a")

            //Limpa as classes do menu
            for(var i=0;i<links.length;i++)
                links[i].className=""

            //Marca o selecionado
            links[atual-1].className="selected"
        }
    }
    xmlhttp.send(null)
}

function menuclick(e){

    //Correção para eventos quebrados da Microsoft
    if(typeof(e)=='undefined')var e=window.event
    source=e.target?e.target:e.srcElement
    //Correção para o bug do Konqueror/Safari
    if(source.nodeType==3)source=source.parentNode

    //Obtém o número quebrando a url
    n=source.getAttribute("href").replace(/.*=/,"")


    //Chama o carrega
    carrega(n)

    //Cancela o click (evita a navegação)
    return false
}

function init(){

    //Obtém os links do menu
    var menu=document.getElementById("menu")
    var links=document.getElementsByTagName("a")

    //Atribui o evento
    for(var i=0;i<links.length;i++)
        links[i].onclick=menuclick
}

if(xmlhttp)window.onload=init


Alguma dica?
Flw

#4 Alex Hiroshi

Alex Hiroshi

    Super Veterano

  • Ex-Admins
  • 4923 posts
  • Sexo:Masculino
  • Localidade:São Paulo - SP

Posted 20/12/2005, 08:59

Uma ideia, meio que gambiarra, mass.. funciona

function init(){

    //Obtém os links do menu
    var menu=document.getElementById("menu")
    var links=document.getElementsByTagName("a")

    //Atribui o evento
    for(var i=0;i<links.length;i++)
        links[i].onclick=menuclick
window.setTimeout("init()",1000);
}

:P
Com ajax a página não é atualizada, então essa função não vai funcionar .. pq ela está sendo chamada no onload..
Agora se você fizer uma atualização na função.. funciona.. ou quem sabe, chamar a função outra vez quando o ajax for chamado... mas tente assim.. ;)
Fórum WMO - Equipe de Desenvolvimento / Banco de Dados - Ex-Administrador

#5 Whitesnake

Whitesnake
  • Visitantes

Posted 20/12/2005, 20:47

olha! funcionou sim!!! a gambiarra!!
uhauhauhah deu certinho cara....

porém tenho outros 2 problemas, um é que os links nas imagens não estão sendo detectados pelo script....
quer ver, dá um pulinho ai no meu site e clica em alguma imagem com link que você verá: http://thelastrose.f...5741e08b59d95b5
as legendas estão sendo interpretadas corretamente, porém o link da imagem é interpretado como um link vazio pelo script...
tem como resolver? ou terei de colocar um onclick="" em todas as imagens ???


AHhh e já aproveitando, tenho essa função, que esconde minha div através da propriedade do CSS, visibility:
function turn(x){

if(x == "off"){var y="on"; n="off"}else{var y="off"; n="on"}
document.getElementById('noticias').className="iframe"+n
document.getElementById('turner').href="javascript:turn('"+y+"')"

}
então ela muda o link aqui em baixo:
<a id="turner" href="javascript:turn('[b]off[/b]')">Link</a>

funciona legal!! só que no lugar do href, queria colocar ele num onclick, pois quero transferí-lo para uma tag td, ex: <td onclick="java script:turn('off')">, só que não estou conseguindo trocar o valor do onclick,
tentei colocar la em cima document.getElementById('turner').onclick mas não funcionou, isso tem jeito??

Me desculpa por encomodar e mais 1 vez obrigado!
abraços!!

#6 Alex Hiroshi

Alex Hiroshi

    Super Veterano

  • Ex-Admins
  • 4923 posts
  • Sexo:Masculino
  • Localidade:São Paulo - SP

Posted 22/12/2005, 10:44

Então, eu não entendi a sua primeira dúvida, o link vazio . . pode explicar melhor?

A segunda, uhmm.. da para usar um attachEvent/addEventListener . . mas esse métodos adicionam um evento, não faz a troca.. não sei se ajudaria..
Fórum WMO - Equipe de Desenvolvimento / Banco de Dados - Ex-Administrador

#7 Whitesnake

Whitesnake
  • Visitantes

Posted 23/12/2005, 00:14

Puxa eu tbm nem pra facilitar as coisas, da uma olhada nesse exemplo, mostra claramente o erro....

<script>
function menuclick(e){
    //Correção para eventos quebrados da Microsoft
    if(typeof(e)=='undefined')var e=window.event
    source=e.target?e.target:e.srcElement
    //Correção para o bug do Konqueror/Safari
    if(source.nodeType==3)source=source.parentNode

    //Obtém o número quebrando a url
    n=source.getAttribute("href")

	alert(n);
return false;
}

function init(){
    //Obtém os links do menu
    var links=document.getElementsByTagName("a")

    //Atribui o evento
    for(var i=0;i<links.length;i++)
        links[i].onclick=menuclick
}

window.onload=init;
</script>


<a href="linkdestino.html">TESTE (esse funciona e esta no mesmo link da imagem)
 <br><br><img src="enderecodaimagem.jpg" width="300" height="300"></a>



Ao invés de mostrar o link, quando clicado na imagem o alert mostra o endereço da imagem....seria algum bug no getAttribute? :huh:

#8 Alex Hiroshi

Alex Hiroshi

    Super Veterano

  • Ex-Admins
  • 4923 posts
  • Sexo:Masculino
  • Localidade:São Paulo - SP

Posted 24/12/2005, 00:25

Acho que entendi... Você só quer pegar o href do link, mas quando o link é em uma imagem, ele não retorna o href do link... certo?

Pq não tenta uma coisa mais simples.. assim..
function init(){
   //Obtém os links do menu
   var links=document.getElementsByTagName("a")

   //Atribui o evento
   for(var i=0;i<links.length;i++)
       links[i].onclick=function(){
alert(this.href);
return false;
}
Se for só para mostrar o href do link, eu acho que já é o bastante.. mas se você estiver fazendo mais alguma coisa, ai já temos que ver outra saida usando o que você já tinha feito..
Fórum WMO - Equipe de Desenvolvimento / Banco de Dados - Ex-Administrador

#9 Whitesnake

Whitesnake
  • Visitantes

Posted 24/12/2005, 14:59

hmm cara, deu certo, eu fiz algumas modificações e ficou jóinha:

function init(){

    //Obtém os links do menu
    var links=document.getElementsByTagName("a")

    //Atribui o evento
    for(var i=0;i<links.length;i++)
        links[i].onclick=function(){
    link=this.href.replace(/.*=/,"")
    id=this.getAttribute("name")


if(id == "out"){
return true;
}else{
    //Chama o carrega
    carrega(link)

    //Cancela o click (evita a navegação)
    return false
}


}
window.setTimeout("init()",1000);
}



huahuahua vlw mesmo!
vc ja pode dizer que ja fez o natal de alguem feliz este ano!!

flw




1 user(s) are reading this topic

0 membro(s), 1 visitante(s) e 0 membros anônimo(s)

IPB Skin By Virteq