Question

$(function() {
    $('.quickNav').live('tap',function(event) {
        if ($(".select_body").is(":hidden")) 
        {
                $(".select_body").show(); 
        } 
        else 
        {
            $(".select_body").hide(); 
        }        
    });
});

这样可以正常工作，除非一旦可见，再次点击它就不会消失。

思想？

Answer 1

$('.quickNav').live('tap',function(event) {
    $(".select_body").toggle(); //  toggles the visibility/display of the element.
});

这与冗长的if / else脚本

相同

请参阅jQuery API文档中的toggle method documentation。

Answer 2

隐藏元素后，其高度和宽度为零。这意味着当您点击相同的位置时，您实际上不会再次点击该元素。

我建议将其不透明度设置为零。以下是您可以做的事情：

$(function() {
    $('.quickNav').live('tap',function(event) {
        if ($(".select_body").is(":hidden"))
        {
            $(".select_body").css("opacity", 1);
        } 
        else 
        {
            $(".select_body").css("opacity", 0);
        }        
    });
});

和相同行为的较短版本：

$(function() {
    $('.quickNav').live('tap',function(event) {
        $(".select_body").css("opacity", 1 - parseInt($(".select_body").css("opacity")));
    });
});

我实际上没有测试过这段代码，所以我甚至不知道它是否会运行！

注意：fadeOut（）会在动画结束时使用hide（），因此在这里没有用。

jquery移动点击事件

2 个答案: