Foros del Web » Programando para Internet » Javascript »

Onclick en el <body>

Estas en el tema de Onclick en el <body> en el foro de Javascript en Foros del Web. Hola en mi pagina tengo lo siguiente: <body onclick="location.href='http://ejemplo.com'"> y me funciona a la perfección, cuando hago click en cualquier parte del body me lleva ...
  #1 (permalink)  
Antiguo 03/07/2012, 12:46
 
Fecha de Ingreso: agosto-2007
Mensajes: 17
Antigüedad: 12 años, 3 meses
Puntos: 0
Onclick en el <body>

Hola en mi pagina tengo lo siguiente:

<body onclick="location.href='http://ejemplo.com'">

y me funciona a la perfección, cuando hago click en cualquier parte del body me lleva a ejemplo.com y si hago click en un enlace a otro sitio el link funciona perfectamente llevandome al link que clicke.

Ahora mi problema es que tengo que cambiar el javascript del onclick para trackear con analytics esos clickcs.

<body onclick="funcion('ejemplo.com', 'categoria', 'contenedor');">

Con esta llamada a la "funcion" no me funciona nada de lo que tengo en el body.
Es decir si hago click en cualquier enlace o lugar de mi pagina se dispara la funcion y no sirve nada de la pagina.

No entiendo porque se comportan diferente y como puedo hacer para que solo se dispare la "funcion" en caso de que el click no sea sobre objetos o enlaces de la pagina.
  #2 (permalink)  
Antiguo 03/07/2012, 17:20
 
Fecha de Ingreso: julio-2011
Mensajes: 220
Antigüedad: 8 años, 3 meses
Puntos: 72
Respuesta: Onclick en el <body>

Cita:
Iniciado por enchufe Ver Mensaje
como puedo hacer para que solo se dispare la "funcion" en caso de que el click no sea sobre objetos o enlaces de la pagina.
Hay que cancelar el burbujeo de eventos con esta función:

Código Javascript:
Ver original
  1. function detenerBurbujeo(e)
  2. {
  3.   if(window.event)
  4.   {
  5.     window.event.cancelBubble= true;
  6.   }
  7.   else
  8.     if(e)
  9.     {
  10.       e.stopPropagation();
  11.     }
  12. }

Se debe de llamar a esta función en el evento 'onclick' de los elementos que no se desea que activen la funcion declarada para BODY, por ejemplo los enlaces. En caso de que estos elementos tengan una función ya asociada al evento 'onclick' se debera llamar a detenerBurbujeo() al final del código de esta función. Dejo un simple ejemplo de su uso.
Código Javascript:
Ver original
  1. <script language="javascript">
  2.  
  3. function verBody()
  4. {
  5.   alert("clic sobre el body");
  6. }
  7.  
  8. function verBoton(e)
  9. {
  10.   alert("clic sobre el botón");
  11.   detenerBurbujeo(e);
  12. }
  13.  
  14. function verDiv(e, mensaje)
  15. {
  16.   alert("el mensaje es: "+mensaje);
  17.   detenerBurbujeo(e);
  18. }
  19.  
  20. function detenerBurbujeo(e)
  21. {
  22.   if(window.event)
  23.   {
  24.     window.event.cancelBubble= true;
  25.   }
  26.   else
  27.     if(e)
  28.     {
  29.       e.stopPropagation();
  30.     }
  31. }  
  32.  
  33. </script>
  34.  
  35. <body onclick="verBody()">
  36. <input type="button" value="primer botón" onclick="verBoton(event)">
  37. <br>
  38. <br>
  39. <br>
  40. <br>
  41. <br>
  42. <br>
  43. <br>
  44. <br>
  45. <br>
  46. <div style="width:350px; height:50px; background-color:#ffcc33;" onclick="verDiv(event,'mensaje de prueba')">
  47. En este div se cancela en burbujeo.
  48. </div>
  49. <br>
  50. <br>
  51. <br>
  52. <br>
  53. <br>
  54. <br>
  55. <br>
  56. <br>
  57. <br>
  58. <a href="http://www.google.com" onclick="detenerBurbujeo(event)">google</a>
  59. <br>
  60. <br>
  61. <br>
  62. <br>
  63. <br>
  64. <br>
  65. <br>
  66. <br>
  67. <div style="width:350px; height:50px; background-color:#ffcc33;">
  68. En este div no se cancela el burbujeo.
  69. </div>
  70. </body>

Es de vital importancia no olvidar pasar el objeto 'event' como parámetro para la función 'detenerBurbujeo()' ya que es necesario para navegadores diferentes a IE.

Última edición por lubtufano; 03/07/2012 a las 17:32

Etiquetas: body, onclick
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:12.