Question

我想创建一个非常简单的菜单，隐藏div“test”，当我点击div“trig”时，测试显示出来。然后，当我再次点击trig时，测试是隐藏的。它在第一次点击时工作，然后当我再次点击三角形动画播放2次时，当我再次点击它时，它会一次又一次地播放。

我的代码是：

<div class="trig">trig</div>
<div class="test">test</div>

<script src="jquery.js"></script>
<script>
$(function () {

$('.test').hide();

function bis() { 
    $('.trig').click(function() { 
        var trig = $(this);
        var test = trig.next();
        test.show(300,function() {
            trig.click(function(){
                test.hide(300, function() { bis(); })
            ;});
        ;});
    });
};

bis();

});
</script>

Answer 1

您的功能只能工作一次，因为在此之后，如果您单击触发器，首先会调用$('.trig').click(function()，显示您的测试，之后还会调用回调中的trig.click(function() show被称为，它会立即隐藏你的测试。

使用toggle()功能切换元素。

$('.trig').click(function() { 
    var trig = $(this);
    var test = trig.next();
    test.toggle(300);
});

文档：http://api.jquery.com/toggle/

小提琴：http://jsfiddle.net/suEg4/

Answer 2

这很简单......尝试如下......它会起作用......

小提琴示例：http://jsfiddle.net/RYh7U/103/

 $('.test').toggle();
 $('.trig').click(function() { 
     $('.test').toggle("slow");
});

jquery无休止的动画问题

2 个答案: