如何在视图MVC中更改img src

Question

这是我的形象：

<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 })'" />

这是应该更改图像源的函数代码：

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

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

这是在将鼠标移动到它们之前图像的图像：

我应该如何更改src属性？

Answer 1

问题不在于src属性。这已正确更改为您设置的内容。问题是它指向错误的目录。

假设你正在使用razor和你的MVC解决方案试试这个：

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

Answer 2

您可以尝试将图片SELECT DISTINCT t.ID ,t.Name ,t.SELCODE ,STUFF( (SELECT '/' + RANGE FROM Table t2 WHERE t.Id = t2.ID AND t.Name = t2.Name AND t.SELCODE = t2.SELCODE FOR XML PATH('')) ,1,1,'') as RANGE FROM Table t 基于当前的html文件位置。实际上，在图片URL中使用~，您假设它位于当前用户主文件夹下。但是，如果用户更改，则URL将指向新用户主文件夹。

我建议您将~标记的当前值更改为：

src

并将<pathOfHtmlFile>/Content/Images/filledstar.png 替换为html文件在您计算机上的路径。