javascript - 损坏的 asp :image in safari browser

Question

我正在使用这样的 ASP.net 图像标签。

<asp:Image ID="Image6" runat="server" ImageUrl='<%#Eval("DeviceStatusFlag")%>' alt=''/>

现在，当 ImageURL 为空时，通常在某些浏览器(如 Firefox)中会显示损坏的图像，但在使用 ält='' 后，这些浏览器不会显示任何内容来代替图像，这是正常的。 但在 Safari 浏览器中我仍然看到一个？当ImageURL为空时标记图像图标。

也尝试过使用这个，

 <asp:Image ID="Image6" runat="server" ImageUrl='<%#Eval("DeviceStatusFlag")%>' AlternateText = '' GenerateEmptyAlternateText='true' />

但它在 Safari 上也不起作用。

如何修复 Safari 的此问题？

Answer 1

首先我怀疑这是一个 asp:image 问题，如果你用标准的 HTML img 标签替换它，我可以想象它会做同样的事情。

显然 safari 希望以这种方式渲染空的 src 属性。如果它是空的，您可以使用 JavaScript 将其隐藏，或者添加透明图像而不是添加任何内容。

我个人认为使用空图像 src 并不是一个好的做法。

您还可以使用带有背景图像 src 的 div，它将不处理任何设置。

编辑:alt 标签是关闭图像或用于辅助访问的替代文本。虽然这可能会改变某些浏览器中的行为，但这不是它的意图。

编辑2。

隐藏您的 ASP.NET 服务器控件。

<asp:Image ID="Image6" runat="server" visible="False" ImageUrl='<%#Eval("DeviceStatusFlag")%>' alt=''/>

更改 ImageUrl 对您来说可能更容易和Visible在服务器端。

<asp:Image ID="Image6" runat="server">

如:

Image6.Visible = False
Image6.ImageUrl = DeviceStatusFlag

或者

获取<img的实际渲染的url正在渲染的标签。

使用

Image6.ClientID

您可以轻松地将其嵌入到 HTML 中，如下所示:

<script>

function setImageVisibility() {
  var imageID = "<%=Image6.ClientID%>",
      imageElement = document.getElementById(imageID);

  if(imageElement) {
     if(imageElement.src === "") {
           imageElement.style.visibility = "hidden";
     }
  }

}

setImageVisibility();

</script>