2010-09-14 32 views
8

tôi đang cố gắng để có được jquery để ẩn div này và đối với một số lý do nó không được làm việc gì tôi làm saiJquery BẬT không làm việc

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> 

Trả lời

14

Bạn cần phải:

  1. Sử dụng document.ready
  2. Chọn neo bên dưới #one div, not t ông div tự

Vì vậy, nó nên là:

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

Cả hai gotchas tôi đã gặp phải lần maaaany :) –

0

Tôi gặp tình cảnh tương tự khi sử dụng ajax và áp dụng giải pháp này. Viết javascript: void (0); thay vì một '#' trong giá trị href. điều này ngăn bạn thêm '#' vào url. sử dụng .live() khi sử dụng ở chế độ ajax. trong .toggle(), vượt qua đối số có hiệu lực như 'Thả', 'trượt', v.v. tại http://jqueryui.com/toggle/.

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

Áp dụng trả về false; cuối cùng ngăn tôi tải lại trang.

Được trả lời chỉ vì kiến ​​thức.

0

Bạn không bao gồm javascript của mình trong $(document).ready(function(){}) v.v. do jQuery đang cố gắng tìm một yếu tố chưa tồn tại!

Các vấn đề liên quan