jquey中 .css改变背景图片问题

$(function(){
$("#first a").each(function(index){ $(this).click(function(){
    $(this).css("background-image","url(../image/expanded.gif)")
 });
});
});css代码
a
{
 background-image:url(../image/collapsed.gif);
}我想实现点击目录切换背景图片  上面的代码点击后 原来的图片消失啦 图片也没切换

解决方案 »

  1.   

    1，首先保证图片路径的相对位置正确。
    2，确保点击之后没有跳转到其他的页面。你可以采用mouseover测试
    例如$(this).mouseover(function () {
    $(this).css("background-image", "url(http://dotnet.aspx.cc/images/rss.gif)");
    });
      

  2.   

    完整测试代码<html>
    <head>
      <title></title>
      <script src="jquery-1.6.4.min.js" type="text/javascript"></script>
    </head>
    <body>
      <form id="form1" runat="server">
      <div id="first"><a href="1.aspx">AA</a> <a href="1.aspx">AA</a> <a href="1.aspx">AA</a>
      </div>
      </form>
      <script type="text/javascript">
        $(function () {
          $("#first a").each(function (index) {
            $(this).mouseover(function () {
              $(this).css("background-image", "url(http://dotnet.aspx.cc/images/rss.gif)");
            });
          });
        });
      </script>
    </body>
    </html>
      

  3.   

    点击显示的方法<html>
    <head>
      <title></title>
      <script src="jquery-1.6.4.min.js" type="text/javascript"></script>
    </head>
    <body>
      <form id="form1" runat="server">
      <div id="first"><a href="1.aspx">AA</a> <a href="1.aspx">AA</a> <a href="1.aspx">AA</a>
      </div>
      </form>
      <script type="text/javascript">
        $(function () {
          $("#first a").each(function (index) {
            $(this).bind("click", function () {
              $(this).css("background-image", "url(http://dotnet.aspx.cc/images/rss.gif)");
              return false;
            });
          });
        });
      </script>
    </body>
    </html>
      

  4.   

    $(this).mouseover(function () {
    $(this).css("background-image", "url(../images/expanded.gif)");
    });设置了鼠标移出 还是原来的图片就消失啦 新的图片也没出来 难道是我路径不对 求解释 
      

  5.   

    我用的相对路径中 image文件夹啊 大哥路径如何写
      

  6.   

    你的当前文件与 expanded.gif的相对位置是怎么样的？
      

  7.   

    如果当前文件与image是同一级父目录，则直接写
    image/expanded.gif
      

  8.   

    我项目中的image文件夹 里面的图片  应该是相对路径吧
      

  9.   

    真是奇怪啦 直接写image/expanded.gif 还是背景图片消失呢
      

  10.   

    你最好写
    $(this).css("background-image","url(<%=Page.ResolveUrl("~/image/expanded.gif")%>)")
    从根目录开始
      

  11.   

    css("background-image","url(<%=Page.ResolveUrl("~/image/expanded.gif")%>)")
    报错 网页提示少）
      

  12.   

    你的页面不是aspx页面吧？
      

  13.   

    是啊 aspx 页面啊 无语啦 
      

  14.   

    你的这个文件与image文件夹的相对关系是怎么样的？你要搞清楚这些。
      

  15.   

    css中设置  background-image:url(../image/collapsed.gif); 这样的路径都显示背景图片 jquery中也是改变CSS属性 路径应该是一样的呀
      

  16.   

    他是通过css来继承，只能通过修改class(样式名)来实现
      

  17.   


    <script type="text/javascript"  src=> 你可以通过src找到图片路径.然后copy到你的css样式里.
    或者
    background-image:url(image/collapsed.gif) 这样呢.
      

  18.   

    可以试试，不行，就把a里面设置背景图的样式去掉再试试
    css("backgroundImage","url(sphere.jpeg)")
      

  19.   


    谁告诉你是一样的啊？
    css里面的url是图片相对css文件夹的的
    aspx文件里面的url相对aspx所在的文件夹的。
    你要是不懂，你就多试试几个方法css("background-image","url(../../image/expanded.gif)")
    css("background-image","url(./image/expanded.gif)")
    ...
    多进行测试
    问你半天 了，当前文件，image文件夹，css文件所在的文件夹是什么关系，你都不说出来，别人也是帮不了你的