1.获取路径的失误:
例子是对一个列表项的悬浮操作:
~(function() { var lists = $(".footer_log>li"); lists.each(function(index,ele) { $(ele).hover(function() { $(this).find("a>img").attr('src',$(this).find("a>img").attr("src").split(".")[0]+".png"); },function() { $(this).find("a>img").attr('src',$(this).find("a>img").attr("src").split(".")[0]+"1.png"); }); }); })();
没毛病,本地环境没毛病,但的确有毛病。
失误原因:我本地 $(this).find("a>img").attr("src");的路径是正确的,http://localhost:8088/frontend/img/img.png,大意的我以(".")点号分割。在线上是域名访问前面就有点号,这样路径从前面的点号分割。
修改:
方法一:
~(function() { var lists = $(".footer_log>li"); lists.each(function(index,ele) { $(ele).hover(function() { $(this).find("a>img").attr('src',$(this).find("a>img").attr("src").split(".png")[0]+".png"); },function() { $(this).find("a>img").attr('src',$(this).find("a>img").attr("src").split(".1png")[0]+"1.png"); }); }); })();
方法二:用replace()代替split();
~(function() { var lists = $(".footer_log>li"); lists.each(function(index,ele) { $(ele).hover(function() { $(this).find("a>img").attr('src',$(this).find("a>img").attr("src").replace(".png", "1.png")); },function() { $(this).find("a>img").attr('src',$(this).find("a>img").attr("src").replace("1.png", ".png")); }); }); })();