puedo usar document.getElementById (someid) .onclic en la etiqueta a

Question

Estoy tratando de llamar a una función javascript onclick. He escrito algo como esto

<script type="text/javascript"> 
    function readPage(){ 
     alert("Hello"); 
    } 

    document.getElementById('read').onclick=readPage; 
</script> 

<a id="read" href="">read</a> 

Estoy tratando de llamar a la función readpage pero no su trabajo? Si escribo etiqueta onclick interior funciona, pero la forma en que he escrito arriba no está funcionando. ¿por qué?

Answer 1

No hay nada malo acerca de cómo lo hace, pero cuando. No puede acceder al DOM (like running getElementById()) antes de que se haya cargado. La cosa más fácil que hacer es ejecutar su código dentro window.onload así:

window.onload = function() { 
    document.getElementById("read").onclick=readPage; 
}; 

Answer 2

primero tendría que desactivar el protocolo dirección por defecto de anclaje (es decir, no dejar que un ir a href)

1. Hacer href="#" en el ancla.
2. Compruebe la event.preventDefault() función ejemplo here.

Answer 3

Usted debe tener:

<script type="text/javascript"> 
    function readPage(){ 
     alert("Hello"); 
    } 

    document.getElementById('read').onclick=readPage; 
</script> 

<a id="read" href="#">read</a> 

Answer 4

Se trabajará con un href atributo vacío (se utilizará la URL actual de la página), pero usted tiene que utilizar, como ya se mencionó, window.onload para adjuntar el controlador de clic, o tiene que mover el script bloque después de elemento a.

De lo contrario, getElementById no puede encontrar el elemento porque aún no existe en el árbol DOM.

<a id="read" href="">read</a> 

<script type="text/javascript"> 
    function readPage(){ 
     alert("Hello"); 
     return false; 
    } 

    document.getElementById('read').onclick=readPage; 
</script> 

Como ya se ha mencionado, se utiliza, por ejemplo, return false; para hacer que el navegador no siga la URL. Incluso necesita esto si cambia la URL a href="#" porque, de lo contrario, el navegador desplazará la página hacia la parte superior.

prueba usted mismo: http://jsfiddle.net/Nj4Dh/1/

---

leer más sobre el traditional event registration model.

Answer 5

Hay dos formas de hacerlo realmente (sin funciones específicas del navegador). Una de ellas es

<script type="text/javascript"> 

    function stopDefault(e) //cross browser function for stopping default actionw 
    { 
     if (e && e.preventDefault) 
     { 
      e.preventDefault(); 
     } 
     else 
     { 
      window.event.returnValue = true; 
     } 
     return false; 
    } 

    function readPage(event){ 
     alert("Hello"); 

     return stopDefault(event);//prevent default action 
    } 



    window.onload = function(event){ 

     document.getElementById('read').onclick=readPage; 


    } 
</script> 

<a id="read" href="#">read</a> 

O:

<script type="text/javascript"> 
    function stopDefault(e) 
    { 
     if (e && e.preventDefault) 
     { 
      e.preventDefault(); 
     } 
     else 
     { 
      window.event.returnValue = true; 
     } 
     return false; 
    } 

    function readPage(event){ 
     alert("Hello"); 

     return stopDefault(event);//prevent default action 
    } 

</script> 
<a id="read" href="#" onclick="readPage(event)">read</a> 

He utilizado el sd función stopDefault Es necesario detener la acción predeterminada de un enlace, de lo contrario, tratar de ir a la eso de URL en el href .