Javascript 如何在视图MVC中更改img src

这是我的形象：

<img id="1star" src="~/Content/Images/emptystar.png" onmouseover="setStars(1)" onmouseout="setStarsBack()" onclick="location.href='@Url.Action("SetRating", "CreativeModels", new { id = GlobalVariables.CurrentBookId, rating = 1 })'" />

它会改变，但浏览器会说，它无法加载图像。这是将鼠标移动到图片后浏览器显示的内容：

这是将鼠标移动到图像之前图像的外观：

---

如何更改

src

属性？

您可以尝试将图像

URL

基于当前html文件位置。实际上，在图像

URL

中使用

~

，您假定它位于当前用户主文件夹下。但是如果用户更改，则

~

将指向新的用户主文件夹

我建议您将

src

标记的当前值更改为：

<pathOfHtmlFile>/Content/Images/filledstar.png

/Content/Images/filledstar.png

---

并将

替换为html文件在计算机上的路径。

问题不在于src属性。将其正确更改为您设置的值。问题是它指向了错误的目录

假设您在MVC解决方案中使用razor，请尝试以下方法：

function setStars(amount) {
   if (amount > 0) {
     document.getElementById("1star").src = "@Url.Content("~/Content/Images/filledstar.png")";
   }
}

---

我把它改成了

“E:/Kursovoi/Super Backup/Eksperement c vistavleniem otsenok/WebApplication4/WebApplication4/Views/CreativeModels/Content/Images/emptystar.png”

，但它没有任何改变。我猜浏览器只能访问服务器上的图片，而我并没有。我没有html文件，我有cshtml文件。@VladimirMootin这不是服务器问题，我试图在我的电脑上重现这个问题，但我得到了预期的结果。您能否将浏览器控制台的输出添加到您的问题中？这有助于解决问题。

function setStars(amount) {
   if (amount > 0) {
     document.getElementById("1star").src = "@Url.Content("~/Content/Images/filledstar.png")";
   }
}