2010-09-14 9 views
8

estoy tratando de conseguir jQuery ocultar esta div y por alguna razón no está funcionando lo que estoy haciendo malJquery no alternar trabajo

http://stat-me.com/jq.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<style type="text/css"> 
#one{ 
    border:3px solid #00F; 
    width:50%; 
} 
#hideme{ 
    border:3px solid #00F; 
    width:50%; 
    display:none; 
} 
</style> 

<script type="text/javascript" src="../_root/js/jquery/jquery-1.4.2.js"></script> 

<script language="javascript" type="text/javascript"> 



$("#one").click(function() { 
$("#hideme").toggle(); 
}); 

</script> 

</head> 

<body> 

<div id="one"> 
<a href="#">hello</a> 
</div> 

<div id="hideme"> 
hi 
</div> 


</body> 
</html> 

Respuesta

14

Es necesario:

  1. Uso document.ready
  2. Seleccione el ancla debajo la #one div, not t div él mismo

lo que debe ser:

$(document).ready(function() { 
    $("#one a").click(function() { 
    $("#hideme").toggle(); 
    }); 
}); 
+1

Ambos problemas que he encontrado muchas veces :) –

0

estoy teniendo la misma situación durante el uso de Ajax y aplicar esta solución. Escribir javascript: void (0); en lugar de un '#' en valor href. esto le impide agregar '#' en url. usa .live() cuando se usa en modo ajax. en .toggle(), pasa el argumento como "Drop", "slide", etc. al más http://jqueryui.com/toggle/.

$(document).ready(function(){ 
     $('#one a').live('click', function(){ 
      $('#hideme').toggle('Drop'); 
      return false; 
     }); 
    }); 

Aplicación return return false; por fin me impide volver a cargar la página.

Respondido solo por conocimiento.

0

No ajusta su javascript en $(document).ready(function(){}) etc. jQuery está tratando de encontrar un elemento que aún no existe.

Cuestiones relacionadas