在看似没有改变之后，一个正在工作的函数现在无法加载资源：net::ERR_CONNECTION_REFUSED

如何解决在看似没有改变之后，一个正在工作的函数现在无法加载资源：net::ERR_CONNECTION_REFUSED

我的网站上有一个功能，每次点击它时都会更改图像。突然这停止工作，在控制台中加载页面时出现此错误：

Failed to load resource: net::ERR_CONNECTION_REFUSED

还有这个一旦点击图像

localhost:3002/pics/gymshark.png:1 GET http://localhost:3002/pics/gymshark.png net::ERR_CONNECTION_REFUSED

我将我的提交恢复到我确信可以正常工作的旧提交，但我仍然收到此错误。知道什么可以改变吗？此功能适用于我的本地浏览器同步服务器以及网站的 github 页面版本。

下面看html和js操作函数

html

<div id='gsk' class="col-lg-4 col-md-6 ">
  <img src="pics/gymshark.png" class='clothes' id='gsk-img' onclick="changeGymShark()" >
  <div class="title">The Gym Shark</div>
  <div class='price'>$45</div>
  <audio class="gymshark" src="music/backroad.mp3" controls></audio>
</div>

js

function changeGymShark(){
    console.log(document.getElementById("gsk-img").src)
    if (document.getElementById("gsk-img").src == "http://localhost:3002/pics/gymshark.png") {
        document.getElementById("gsk-img").src = "http://localhost:3002/pics/gymshark-back.png"
    }
    else {
        document.getElementById("gsk-img").src = "http://localhost:3002/pics/gymshark.png"
    }
}

感谢您的帮助。

解决方法

它在本地是否仍然适用于您？

问题似乎出在您的 getGymShark() 函数中，因为您在 github 上的站点仍在尝试访问 localhost 域，这在托管站点上不起作用。尝试编辑它以使用服务器上图像的相对路径：

function changeGymShark(){
    console.log(document.getElementById("gsk-img").src)
    if (document.getElementById("gsk-img").src == "/domestic-accessories/pics/gymshark.png") {
        document.getElementById("gsk-img").src = "/domestic-accessories/pics/gymshark-back.png"
    }
    else {
        document.getElementById("gsk-img").src = "/domestic-accessories/pics/gymshark.png"
    }
}