3

divが展開されているか折りたたまれているかに基づいて、slideToggleで画像を交換しようとしています。私はそれを一方向に機能させて、画像をプラスからマイナスに変更しますが、それは1つのdivでのみ機能し、複数あり、1回だけ機能します。トグルしません。

jQueryは次のとおりです。

$(".content").toggle(1);
$(".expand").click(function () {
    $(this).next(".content").slideToggle(400);

    if ($(".image1").attr('src', "../nathan/plus.png")) {
        $(".image1").attr(
            'src', 
            $(".image1").attr('src').replace('plus', 'minus')
        );
    } else {
        $(".image1").attr(
            'src', 
            $(".image1").attr('src').replace('minus', 'plus')
        );
    }
});
});

IndexOf（）は機能しますが、divを複製すると、クリックするとすべて変更されます。HTMLは次のとおりです。

<div class="list">
<h2 class="expand">Title1<img class="image1" src="../nathan/plus.png"></h2>
<div class="content">
</div>
</div>

<div class="list">
<h2 class="expand">Title2<img class="image1" src="../nathan/plus.png"></h2>
<div class="content">
</div>
</div>
4

1 に答える 1

2

setterメソッドを使用して`src'をチェックしています

if ($(".image1").attr('src', "../nathan/plus.png"))

代わりに使用する

if ($(".image1").attr('src') == "../nathan/plus.png"))

または、indexOf（）を使用して、ソースに画像が含まれているかどうかを確認することをお勧めします。

if ($(".image1").attr('src').indexOf("plus.png") > -1)

編集：

おそらくこのようにして、すべてが変更されないようにすることができます-これは、画像を探すためのコンテキストです

$(".expand").click(function() {
    $(this).next(".content").slideToggle(400);
    var $img = $(".image1", this);
    if ($img.attr('src').indexOf("plus.png") > -1) {
        $img.attr('src', $img.attr('src').replace('plus', 'minus'));
    } else {
        $img.attr('src', $img.attr('src').replace('minus', 'plus'));
    }
});​

それで

$(".image1", this);

と同じになります

$(this).find('.image1');
于 2012-09-05T01:48:22.527 に答える