событие jquery mobile tap

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.

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 () в конце анимации, поэтому здесь это не поможет.