3

クリックイベントでそれぞれのアコーディオンテキストを開くいくつかの画像があります。このコードを使用しており、正常に動作しています:

脚本

$('#openfirst').click(function() {
  $(".accordion").accordion({
    active: 0
  });
});
$('#opensecond').click(function() {
  $(".accordion").accordion({
    active: 1
  });
});

HTML

<div class="large-3 columns">
    <p id="openfirst">
      <img class="imgs" id="img1" />
    </p>
</div>

等...

画像をクリックすると、別の画像に変わります。このコードを使用しており、正常に動作しています。

脚本

var imgactive = $('.imgs');
imgactive.on('click', function(){
    imgactive.removeClass('active');
    $(this).addClass('active');
});

状況は、アコーディオンがそれ自体で完璧に機能し、画像がアコーディオンにリンクされており、同様に機能しているということです（画像をクリック>画像の背景が変更され、それぞれのアコーディオンが開きます）、私の問題は、アコーディオンをクリックすると、それぞれの画像も変化します。

お読みいただきありがとうございます。お役に立てれば幸いです。

4

1 に答える 1

1

イベントを使用しactivateて、新しいエキスパンド パネルに応じてボタンの画像/状態を変更できます。ドキュメント:

パネルがアクティブ化された後 (アニメーションの完了後) にトリガーされます。アコーディオンが以前に折りたたまれていた場合、ui.oldHeader と ui.oldPanel は空の jQuery オブジェクトになります。アコーディオンが折りたたまれている場合、ui.newHeader と ui.newPanel は空の jQuery オブジェクトになります。

コード：

$(function () {
    $("#accordion").accordion({
        activate: function (event, ui) {
            alert($(ui.newHeader).attr("id"))
        }
    });
});

デモ: http://jsfiddle.net/IrvinDominin/7Ak94/1

于 2013-08-14T10:11:30.577 に答える