jQuery - 无法隐藏父项

我似乎偶然发现了一个非常简单的问题。我试图隐藏一个父div当孩子被点击。jQuery - 无法隐藏父项

这是我的HTML;

<div class="wave-wrap"><div class="wave">click me</div></div> 

<div class="wave-wrap"><div class="wave">click me</div></div> 

<div class="wave-wrap"><div class="wave">click me</div></div>

这是我的jQuery;

$('.wave').click(function() { 
alert($(this).parent().html());     
$(this).parent().hide('slow'); 
});

警报似乎表明我有正确的选择器，但父div拒绝隐藏。任何想法为什么？

来源

2011-02-02 Sam

看起来它应该工作，对我来说：/尝试更改hide（）像slideToggle（）？ – sevenseacat 2011-02-02 12:29:13

你肯定有问题之外的事情，你可以看到*只有*你的代码在这里工作的问题在这里：http://www.jsfiddle.net/nick_craver/ukRuK/ – 2011-02-02 12:29:49

尝试用$(this).closest(".wave-wrap").hide()代替。

来源

2011-02-02 12:31:05

嗨，大家好，感谢您的帮助在这里。奇怪的是，如果我将hide（）切换为slideToggle，它会操纵父项。我想知道为什么hide（）不能正常工作？在包装器上有一个display：block，但不应该被hide（）覆盖吗？ – Sam 2011-02-02 13:31:25

您的代码工作得非常好。看看下面的例子：

<!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> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(e) { 
       $('.wave').click(function() { 
        alert($(this).parent().html());     
        $(this).parent().hide('slow'); 
       }); 
      }); 
     </script>  
    </head> 

    <body> 
     <div class="wave-wrap"><div class="wave">click me</div></div> 

     <div class="wave-wrap"><div class="wave">click me</div></div> 

     <div class="wave-wrap"><div class="wave">click me</div></div>  
    </body> 
</html>

来源

2012-09-02 06:54:55

jQuery - 无法隐藏父项

回答

相关问题