Question

我有一些图片在点击事件中打开各自的手风琴文字，我正在使用此代码并且工作正常：

SCRIPT

$('#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>

等...

当你点击图像时，它会换另一个图像，我正在使用此代码并且工作正常：

SCRIPT

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

情况是手风琴对自己有效，图像与手风琴相关并且也正常工作（点击图像＆gt;图像背景变化及其各自的手风琴打开），我的问题是我不知道如何将手风琴与图像联系起来，以便在点击手风琴时它的相应图像也会发生变化。

感谢您的阅读，如果您能提供帮助......那太好了！

Answer 1

您可以使用activate事件，以便根据新的展开面板更改按钮图像/状态; DOC：

激活面板后触发（动画后）完成）。如果手风琴先前已经倒塌，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

触发手风琴与外部按钮/图像，反之亦然

1 个答案: