1

我的一页上有七张图片。我有显示/隐藏功能，它用“奇数”按钮显示奇数图像，用“偶数”按钮显示偶数图像。它现在的工作方式是，如果您单击奇数按钮，它只会显示奇数。反之亦然。

但是，如果显示奇数图像并且我单击偶数按钮，我希望它们全部显示，因此它将它们添加到已经显示的图像中。如果没有显示任何内容，单击偶数按钮应该只显示偶数图像吗？奇怪的图像也是如此。

但是，如果当前显示所有图像，单击偶数应该显示偶数图像并隐藏奇数...单击奇数应该显示奇数并隐藏偶数。

我希望这是有道理的。我不知道如何让它发挥作用。我需要条件语句吗？我只是不知道我会检查什么。

这是工作代码，但不是我希望它如何工作。

<script>
$(function () {
    $("#evenButton").click(function () {
        $("img").show("slow");
        $("img:even").show("slow");
    });
})
</script>

<script>
$(function () {
    $("#oddButton").click(function () {
        $("img").show("slow");
        $("img:even").hide("slow");
        $("img:odd").show("slow");
    });
})
</script>
4

2 回答 2

1

我发现很难理解您的问题，但您希望图像在按下按钮时在隐藏和显示之间切换？

我已经根据您的问题的另一次阅读进行了更新

$("#evenButton").click(function () {
    if($("img:even").is(':visible') && $("img:odd").is(':visible')) {
        $("img:odd").toggle("slow");        
    } else {
        $("img:even").show("slow");
    }
});

$("#oddButton").click(function () {
    if($("img:odd").is(':visible') && $("img:even").is(':visible')) {
        $("img:even").toggle("slow");        
    } else {
        $("img:odd").show("slow");
    }
});

http://jsfiddle.net/HXycX/2/

于 2013-08-08T00:46:32.890 回答
0

如果我正确地回答了您的问题，您希望您的按钮切换偶数或奇数的状态，而不仅仅是显示它们。为此，您需要将按钮的相应图像是否显示在变量中。像这样的东西可以工作：

var evenImagesVisible = false;

function toggleEvenImages() {
    evenImagesVisible = !evenImagesVisible // flip the state of the even images

    if (evenImagesVisible) {
         $("img:even").show("slow");
    }
    else {
         $("img:even").hide("slow");
    }
}

这是仅切换偶数图像的方法。切换奇数图像是完全一样的，只是改变一些变量名和选择器。

于 2013-08-08T00:43:53.337 回答