Mam 2 obrazy w oddzielnym div

<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>

Toggle jQuery działa dobrze, ale jeśli otworzę div w tym czasie plus.gif powinien być widoczny, ale tutaj dla mnie są widoczne.

$('.morebutton').live("click", function () {
                $('.more').show();
                $('.morebutton').hide();
            });
            $('.morebutton2').live("click", function () {
                $('.more').hide();
                $('.morebutton').show();
            });
0
KesaVan 12 sierpień 2014, 19:15

2 odpowiedzi

Najlepsza odpowiedź

Możemy użyć toggle(), aby wyświetlić lub ukryć dopasowane elementy. Jeśli element jest początkowo wyświetlony, zostanie ukryty; Jeśli ukryty zostanie wyświetlony.

Zmienna EL (krótka dla elementu) pasuje do obu klas .morebutton i .morebutton2, ponieważ oboje zaczynają się od "więcej".

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

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

jsfiddle

1
Jack 13 sierpień 2014, 18:31

Lubię to?

Jsfiddle Demo

$(document).ready(function () {
    $('.morebutton2').hide();

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

    $('.morebutton2').on("click", function () {
        $('.morebutton2').hide();
        $('.morebutton').show();
    });
});
1
Austin 12 sierpień 2014, 15:20