0

我想建立一个手风琴效果,我已经达到了一个很好的结果,但是当我再次点击同一个按钮时,图片不会改变,直到我点击另一个标题......

$(document).ready(function () {
$('.boxes').slideToggle("fast");
item = "";
item0 = "";

$(function () {
    $('.box_head').click(function () {
        idelem = $(this).attr('id');
        idelemdiv = idelem.replace('boxhead_', 'box_');

        if (item === idelemdiv){
            $('#' + idelemdiv).slideToggle("normal");
            item = "";

        } else {
            $('#' + item).slideToggle("normal");
            $('#' + idelemdiv).slideToggle("normal");
            $('#' + item0).children('img').attr({
            src: 'http://wp.wicker-schuetz.de/wp-content/themes/Drlawyer/images/buttons/bg-open.png'
        });
            item = idelemdiv;
            item0 = idelem;
        }

        if ($('#' + idelem).children('img').attr({
            src: 'http://wp.wicker-schuetz.de/wp-content/themes/Drlawyer/images/buttons/bg-open.png'
            })) {$('#' + idelem).children('img').attr({
            src: 'http://wp.wicker-schuetz.de/wp-content/themes/Drlawyer/images/buttons/bg-close.png'
            });}
        });
    });
});

jsfiddle

我的弃牌在哪里?

最后我认为它需要一个其他的争论,但我的尝试不会奏效。

4

2 回答 2

0

这总是返回 true:

 if ($('#' + idelem).children('img').attr({
        src: 'http://wp.wicker-schuetz.de/wp-content/themes/Drlawyer/images/buttons/bg-open.png'
        }))

如果你把它改成这样,你可能会得到你正在寻找的结果:

if ($('#' + idelem).children('img').attr('src') = 'http://wp.wicker-schuetz.de/wp-content/themes/Drlawyer/images/buttons/bg-open.png')

这是一个小提琴:http: //jsfiddle.net/zDpgQ/5/

于 2013-08-30T18:51:39.873 回答
0

您可以像这样使整个事情变得更容易:

例子

$(function() {
    $('.boxes').hide();
    $(document).on('click', '.box_head', function(e) {
        var head = $(this),
            icon = head.children('img'),
            box = head.next('.boxes');
        box.siblings('.boxes:visible').slideUp('normal', function(e) {
            $(this).prev('.box_head').children('img').prop('src', icon.prop('src').replace('bg-close', 'bg-open'));
        });
        box.slideToggle('normal', function(e) {
            if ($(this).is(':visible')) {
                icon.prop('src', icon.prop('src').replace('bg-open', 'bg-close'));
            }
            else {
                icon.prop('src', icon.prop('src').replace('bg-close', 'bg-open'));
            }
        })
    });
});

有趣的例子!

于 2013-08-30T18:54:49.457 回答