jQuery show hide div,替换切换但不确定如何

时间:2012-01-04 21:15:40

标签: jquery

我有一些代码使用切换来显示和隐藏div,但现在我想根据它所处的状态来做一些事情。我不知道该怎么做。我想我需要将切换分开显示和隐藏。

我已经有了这段代码,并且在它下面有一些伪代码来暗示我正在尝试做什么。

$(function() {
    $('.collapse_btn').click(function() {
        $("#shot_btn").attr("src","/images/contract_icon.gif");//replaces src in existing image with animated version. To be done when hide() runs
        $('.imgbox').toggle(400);
        $('#shot_h3').addClass("border_radius");
        $("#shot_btn").attr("src","/images/expand_icon.gif");//replaces contract_icon.gif. To be done when show() runs
    });
});


$(function() {
    $('.collapse_btn').click(function() {
        if(currently visible){
            $("#shot_btn").attr("src","/images/contract_icon.gif");//replaces src in existing image with animated version. To be done when hide() runs
            $('.imgbox').hide(400);
        }
        else{
            $('#shot_h3').removeClass("border_radius");
            $("#shot_btn").attr("src","/images/expand_icon.gif");//replaces contract_icon.gif. To be done when show() runs
            $('.imgbox').show(400);
    });
});

感谢您提供的任何帮助。

1 个答案:

答案 0 :(得分:3)

if ($('.imgbox').is(':visible')) {
   //hide
}
else {
   //show
}

所以使用你的代码:

$('.collapse_btn').click(function() {
    if ($('.imgbox').is(':visible')) {
        $("#shot_btn").attr("src","/images/contract_icon.gif");
        $('.imgbox').hide(400);
    }
    else {
        $('#shot_h3').removeClass("border_radius");
        $("#shot_btn").attr("src","/images/expand_icon.gif");
        $('.imgbox').show(400);
    }
});