Question

为什么这不起作用？我在网上寻找过教程，但他们只展示了如何用按钮显示/隐藏。我想切换一个元素的高度。

$('.oldestinititives').mousedown(function() {
    $(this).animate({"height": 450}, "slow");
    $(this).addClass("pop");
});
$('.pop').mousedown(function() {
    $(this).animate({"height": 250}, "slow");
    $(this).removeClass("pop");
});

在CSS中，块默认为250px。单击该元素会显示内容，但再次单击它不会隐藏它。使用firebug我可以看到类'pop'被添加但它似乎没有针对它。发生了什么事？

感谢，埃文

Answer 1

在运行时添加类时，是否使用jquery live()来绑定事件？如果没有，请使用它：

http://api.jquery.com/live/

Answer 2

当您将mousedown事件挂钩到具有pop类的元素时，没有与此选择器匹配的元素。在为此工作添加类时，必须绑定事件。甚至更好：使用delegate或live绑定事件

Answer 3

试试这个（工作示例 http://jsfiddle.net/saelfaer/CyD2g/）

$('.oldestinititives').live("click", function() {
    if($(this).is('.pop'))
    {
        $(this).animate({"height": 250}, "slow", function(){
            $(this).toggleClass("pop");
        }); 
    }
    else
    {      
        $(this).animate({"height": 450}, "slow", function(){
            $(this).toggleClass("pop");
        }); 
    }
});

我冒昧地将你的两个事件处理程序合并在一起，因为它们本来可以合并，这取决于你在函数内部实际做了什么，你可以让它更短，而没有大的if-else结构...

这里的想法是你使用.live("click", function(){});这会将事件绑定到任何将成为你的选择器的有效候选者的项目。即使在执行代码时，元素还没有正确的类名或ID。

JQuery和显示/隐藏内容

3 个答案: