Question

继承我的Jquery

$(document).ready(function(){
$('a.toggle').css('background-image','url(http://blah/resources/img/close.gif)');

$(".sectiontitle").click(function(e){
  $(this).next('div').slideToggle("slow");

  el = $(this).find(".toggler > a.toggle");

  currBg = el.css('background-image');
  if (currBg=="url(http://blah/resources/img/close.gif)"){
    currBg="url(http://blah/resources/img/open.gif)";
    console.log('open gif');
  }
  else{
    currBg="url(http://blah/resources/img/close.gif);"
    console.log('close gif');
  }
  console.log(currBg);
  el.css('background-image',currBg);

  return false;
});

}）;

继承我的html面板（其中有很多）

    <div class="majorsection">

    <div class="sectiontitle">
        <h2>Restaurant Bookings</h2>
        <div class="toggler">
            <a title="click to hide" class="toggle" href="http://blah/index.php/console/index"><span>-</span></a>
        </div>
        <div class="clear"></div>
    </div>
    <div class="msectioninner">
<div class="minorsection">
    <div class="sectionlist">
                    <div class="section"></div>
    </div>
    <div class="sectionoptions">
        <div class="clear"></div>
    </div>
</div>
    </div>
</div>

图像会在第一次点击时切换，面板会双向滑动，但图像不会变回

Answer 1

为什么不使用两个css类。它将使代码更清晰，更易于维护。

尝试失败的一件事就是改变

.css('background-image', currBg)

到

.css('backgroundImage', currBg)

我记得有一个问题（但认为它已被修复）。如果这不起作用你有一个显示问题的网址吗？

Answer 2

您在检索后立即尝试console.log(currBg);了吗？ url（）属性可能正在被重写/解析。不确定 - 但是如果你正在测试图像的.attr（'src'）会出现类似的问题 - 它可能不再是你设置它的了。

建议：不要对背景图像值进行硬编码，而应考虑做类似的事情：

$(document).ready(function(){
  $('a.toggle').addClass('closed');
  $(".sectiontitle").click(function(e){
    $(this).next('div').slideToggle("slow");
    el = $(this).find(".toggler > a.toggle");
    // jQuery 1.3 has this: 
    // el.toggleClass('.closed');
    // otherwise - use this:
    if (el.is('.closed'))
    {
      el.removeClass('closed');
    } else {
      el.addClass('closed');
    }
    return false;
  });
});

然后你的a.toggle选择“open”的background-image属性，a.toggle.closed获取CSS文件中的“关闭”图像。

为什么我的Jquery背景图像不能切换？

2 个答案: