javascript - 使用 jQuery 显示隐藏图像

Question

我在单独的 div 中有 2 张图片

<a href="javascript:void(0)" class="morebutton" ><img src="/Images/PLUS.gif" /></a>
<a href="javascript:void(0)" class="morebutton2" ><img src="/Images/MINUS.gif"/></a>

Jquery 切换工作正常，但如果我当时打开 div plus.gif 应该可见，但对我来说两者都可见。

$('.morebutton').live("click", function () {
                $('.more').show();
                $('.morebutton').hide();
            });
            $('.morebutton2').live("click", function () {
                $('.more').hide();
                $('.morebutton').show();
            });

Answer 1

我们可以使用toggle() 来显示或隐藏匹配的元素。如果该元素最初显示，它将被隐藏；如果隐藏，它将显示。

el(元素的缩写)变量匹配 .morebutton 和 .morebutton2 这两个类，因为它们都以“more”开头。

$(".morebutton2").hide();
var el = $("a[class^='more']");

$(el).click(function () {
    $(el).toggle();
});

JSFIDDLE