Html 如果源不存在，如何显示默认图像

我在myasp.net MVC web应用程序中有以下代码：-

 <a href="~/Content/uploads/@(item.ID).png"><img class="thumbnailimag" src="~/Content/uploads/@(item.ID).png"  /></a>   @Html.ActionLink(item.Name,"Details","DataCenter", new{id = item.ID},null)

但是，如果图像不存在，每个bowser将以不同的方式对待它。我设置了背景图像，但仍在IE上，它将在默认图像上显示一个“X”，如下所示：-

---

如果src不存在，是否有方法显示默认图像，有人能提供建议吗？

当然，对于您的图像，请使用：

---

CSS中没有解决方案，它需要将JS应用于每个

标记，或者使用顶级处理程序替换所有图像的

onerror

事件。

您可以尝试添加一些JS，例如，将事件侦听器添加到img标记：

<img id="something" data-isloaded="false" onload="$(this).data('isloaded', 'true')" />

---

最好在服务器端处理此问题：

public static class HtmlHelperExtensions
{
    public static string ImageOrDefault(this HtmlHelper helper, string filename)
    {
        var imagePath = uploadsDirectory + filename + ".png";
        var imageSrc = File.Exists(HttpContext.Current.Server.MapPath(imagePath))
                           ? imagePath : defaultImage;

        return imageSrc;
    }

    private static string defaultImage = "/Content/DefaultImage.png";
    private static string uploadsDirectory = "/Content/uploads/";
}

然后，您的视图将简化为：

<img src="@Html.ImageOrDefault(item.ID)" />

可能重复+1的可能重复，尽管我担心这是一个简单而最好的解决方案！谢谢。+1谢谢@SW4（还有约翰·约翰的提问）为我节省了很多时间/代码/实验/失败/心碎。也许

onerror=“this.onerror=null；this.src='path/to/replacement/image.jpg'”

但是在哪里创建这个类更好，在Controller文件夹下还是在Model文件夹下？thnaks@JohnJohn我倾向于创建一个名为

Extensions

或

Helpers

的新文件夹，并将其放入其中。但是，为了使其正常工作，您需要将名称空间添加到

~/Views/Web.config

文件中（确保它是该名称空间，而不是项目根目录中的

Web.config

）。只需查找元素

。在这里，您会发现已经添加了一些名称空间。在这些下面，您可以添加如下内容：

。

public static class HtmlHelperExtensions
{
    public static string ImageOrDefault(this HtmlHelper helper, string filename)
    {
        var imagePath = uploadsDirectory + filename + ".png";
        var imageSrc = File.Exists(HttpContext.Current.Server.MapPath(imagePath))
                           ? imagePath : defaultImage;

        return imageSrc;
    }

    private static string defaultImage = "/Content/DefaultImage.png";
    private static string uploadsDirectory = "/Content/uploads/";
}

<img src="@Html.ImageOrDefault(item.ID)" />