Não consigo evitar comportamento padrão de hiperlink (evt)

eduardovalente · Agosto 9, 2013

Bom dia. Estou seguindo um código de um livro e não estou conseguindo executar evt.preventDefault() para o hiperlink de uma imagem. Na sessão de depuração, o ponteiro do breakpoint sequer passa em cima dessa instrução e também não consigo executar link.blur(); para o elemento <a>.

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>Galeria de Imagens</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link href="princ.css" rel="stylesheet" type="text/css">
        <script type="text/javascript" src="galeria_lib.js"></script>
        <script type="text/javascript" src="galeria.js"></script>
    </head>
    <body>
        <div id="conteudo">
            <div id="header">  
                <h1>Galeria de Imagens de Livros</h1>
                <p>Clique num dos links abaixo para ver a imagem.</p>
            </div>
            <div id="nav"> 
                <ul id="lista_imagem">
                    <li><a href="img/gt1.jpg" title="guerra">A Guerra dos Tronos</a></li>
                    <li><a href="img/gt2.jpg" title="furia">A Fúria dos Reis</a></li>
                    <li><a href="img/gt3.jpg" title="tormenta">A Tormenta de Espadas</a></li>
                    <li><a href="img/gt4.jpg" title="festim">O Festim dos Corvos</a></li>
                    <li><a href="img/gt5.jpg" title="danca">A Dança dos Dragões</a></li>    
                </ul>    
            </div>      
            <p><img src="img/martell.jpg" alt="martell" title="martell" id="martell"></p>
            <p><span id="legenda"></span><br>
        </div>
    </body>
</html>

princ.css

/* 
    Document   : princ
    Created on : 08/08/2013, 21:01:38
    Author     : eduardo
    Description:
        Purpose of the stylesheet follows.
*/

body {

    font-family: Arial, Verdana, sans-serif;
    background: #FF9730;

}

#header h1, #header p {
    text-align: center;  
    color: #f71d1d;
}

#header p {
   width: 500px;
   margin: 10px auto;
}

#nav {
    margin: 40px 60px;
}

#nav li {
    display: inline;
    margin: 0px 5px;
    letter-spacing: 0.1em;
}

a:link {
    color: #666633;
    text-decoration: none;
}

a:visited {
    color: #894910;
}

a:hover {
    color: #891717;
    border: 1px solid #f71d1d;
    padding: 5px;
}

a:active {
    color: #fff600;
    border: 1px solid #fff600;
}

img[title="martell"] {

    display: block;
    width: 720px;
    height: 400px;
    margin: 50px auto;
    border: 4px solid #f71d1d;
}

galeria_lib.js

var I = function(id)
{
    return document.getElementById(id);
}

var T = function(nome)
{
    return document.getElementsByTagName(nome);
}

var N = function(nome)
{
    return document.getElementsByName(nome);
}

var GaleriaImagem = function(id_lista, id_imagem, id_legenda)
{
    var that = this;
    this.lista_imagem = I(id_lista);
    this.elem_imagem = I(id_imagem);
    this.legenda = I(id_legenda);

    this.validarElem(this.lista_imagem, "*", "ID da lista");
    this.validarElem(this.elem_imagem, "img", "ID da imagem");
    this.validarElem(this.legenda, "span", "ID da legenda");

    this.links_imagens = this.lista_imagem.getElementsByTagName("a");
    if (this.links_imagens.length == 0)
    {
      throw new Error("Galeria de Imagem: lista não contém elementos a");
    }
    
    var i, elem, imagem;
    this.cache_imagem = [];
    for(i = 0; i < this.links_imagens.length; i++)
    {
       elem = this.links_imagens[i];
       elem.onclick = function(evt)
       {
          var link = this;
          if(!evt)
           evt = window.event;
          
          that.click_link(evt, link);
       }
       
       imagem = new Image();
       imagem.src = elem.href;
       this.cache_imagem.push(imagem);
    }    
}    

GaleriaImagem.prototype.validarElem = function(elem, tag_nome, desc_elem)
{
   if(!elem)
   {
      throw new Error("Galeria de Imagens: " + desc_elem + " não encontrado.");  
   }
   
   if(elem.nodeType !== 1)
   {
      throw new Error("Galeria de Imagens: " + desc_elem + "Não é um id do elemento");  
   }    
   
   if(tag_nome !== "*" && elem.nodeName !== tag_nome.toUpperCase())
   {
      throw new Error("Galeria de Imagens: " + desc_elem + " não é uma " + tag_nome.toUpperCase() + " tag."); 
   }
}

GaleriaImagem.prototype.click_link = function(evt, link)
{
   this.elem_imagem.src = link.href;
   this.legenda.firstChild.nodeValue = link.title;
   link.blur();
   
   if(evt.preventDefault)
   {
      evt.preventDefault(); 
   }    
   else {
     evt.returnValue = false;
   }  
}

galeria.js

var galeria;

window.onload = function()
{
   galeria = new GaleriaImagem("lista_imagem", "martell", "legenda");
}

Editado Agosto 9, 2013 por eduardovalente

Entrar

Não consigo evitar comportamento padrão de hiperlink (evt)

Pergunta

eduardovalente

Link para o comentário

Compartilhar em outros sites

0 respostass a esta questão

Posts Recomendados

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades