在 jQuery 中更改 img src答案

【问题标题】：Changing img src in jQuery在 jQuery 中更改 img src
【发布时间】：2016-04-17 22:33:41
【问题描述】：

我希望用户向下滚动页面后更改图像（图像大小相同，但颜色不同）：

HTML

<ul class="social-media-nav-center">
  <li>
    <a href="https://twitter.com/" target="_blank"><img id="twitter" class="small" src="path/to/image-icon.png" /> 
    </a>
  </li>
</ul>

jQuery

$(document).ready(function(){
  $(window).scroll(function(){      
    if($(window).scrollTop() > $(window).height()) {
      $("#twitter").attr("src", "../path/to/image-color-icon.png");
    }
  })
})

当我向下滚动页面时，图像无法识别，它只是一个问号。

注意

图片路径是有效的，相信我。

我觉得这是一个非常简单的解决方法，有什么想法吗？

【问题讨论】：

可能是因为路径无效？检查网络选项卡是否有错误。
为什么在 HTML 中没有 ../ 在 JS src 中？您是否意识到 src 是基于 html 文件位置，而不是 JS 文件位置？
在console 选项卡中确认没有错误，在这种情况下，我将禁止访问图像>
它说的正确的路径实际上是不正确的。这是我的错误。我给了它正确的路径。我再也不会使用 Adobe 括号了。给大家带来的不便，我深表歉意。
这是这个问题最好的部分：“图像路径是有效的，相信我。” ！！！

标签： javascript jquery html css

【解决方案1】：

试试这个

var path='path/to/image-color-icon.png'
$("#twitter").attr("src", path);

【讨论】：

这与正在发生的问题相同。这有什么新东西？

【解决方案2】：

检查到

HTML

<ul class="social-media-nav-center">
  <li>
    <a href="https://twitter.com/" target="_blank"><img id="twitter" class="small" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcRgdlWvqZIB0r6qkjFS_t9uMKD9gQIVMV3fE-Vw9BMoRfNEmJG2" /> 
    </a>
  </li>
</ul>

呸呸呸

$(document).ready(function(){
  $(window).scroll(function(){      
    if($(window).scrollTop() > $(window).height()) {
      $("#twitter").attr("src", "http://www.planwallpaper.com/static/images/744081-background-wallpaper.jpg");
    }
  })
})

CSS

.social-media-nav-center{height:1000px;}

https://jsfiddle.net/yakcbanL/

【讨论】：

我将标记为正确，因为我的文本编辑器欺骗了我。它说的正确的路径实际上是错误的。这是我的错误。我已经给了它正确的路径。
当 OP 接受这个答案时，怎么会有人反对这个答案。投反对票的人请在投反对票之前发表评论。这将帮助人们纠正或改进所提供的解决方案。