IE 8/7中的Jquery切换效果

时间:2011-09-17 16:32:30

标签: accordion jquery

我使用以下jquery toogle功能来显示/隐藏详细列表

    $('dt').toggle(
function() {
    $(this).next('dd').slideUp();
    $(this).addClass('selectedArrow');

},
function() {
    $(this).next('dd').slideDown();
    $(this).removeClass('selectedArrow');

}
);

这会在除IE7和IE8之外的所有浏览器上添加selectedArrow类,此类的原因是其背景图像会根据toogle的状态而变化,

我有什么想法可以让它在IE7 / 8上添加类或知道获得相同结果的替代方法。


感谢您的帮助,最终设法使其工作,原来是我的CSS中箭头的背景对齐问题

2 个答案:

答案 0 :(得分:2)

您的代码在IE6和IE9以及IE9的兼容模式下工作,该模式模拟this jsFiddle中的IE7和IE8,所以我认为这个问题与您没有向我们透露有关您的实际情况的内容有关页面,您的HTML或其他有关您代码的内容。

这是我在演示中用来表明它有效的方法:

HTML:

Click on Coffee or Milk<br><br>
<dl>
  <dt>Coffee</dt>
    <dd>- black hot drink</dd>
  <dt>Milk</dt>
    <dd>- white cold drink</dd>
</dl>

并且,我使用了您的确切代码:

$('dt').toggle(
    function() {
        $(this).next('dd').slideUp();
        $(this).addClass('selectedArrow');
    },
    function() {
        $(this).next('dd').slideDown();
        $(this).removeClass('selectedArrow');
    }
);

答案 1 :(得分:0)

你有没有尝试过另一种解决方案?类似的东西:

$('#dt').click(function(){
   $(this).next('dd').slideToggle().toggleClass('selectedArrow');
});