如果找不到图像源，则隐藏 input="image"答案

【问题标题】：Hide input="image" if image src not found如果找不到图像源，则隐藏 input="image"
【发布时间】：2010-02-22 19:34:14
【问题描述】：

如果找不到源图像，我正在使用以下 JavaScript 函数隐藏网页上的图像：

function Image_OnError(image) {
    image.onerror = "";
    image.style.visibility = "hidden";
    return true;
}

我将以下属性添加到我的图像中，以在出现错误onerror="Image_OnError(this);" 时调用上述方法。

问题是我需要对 <input type="image" /> 元素执行相同的操作，但由于输入元素似乎没有 OnError 事件，因此无法弄清楚如何执行此操作。

我可以只包含一个与输入具有相同 src 值的额外图像，然后在图像的 OnError 事件中修改输入元素的可见性，但这似乎有点混乱。

【问题讨论】：

有什么理由不能把它改成标签本身？
输入元素是从一个 asp:ImageButton 服务器控件创建的，我需要使用它来引发必要的 OnCommand 事件。

标签： asp.net html

【解决方案1】：

如果您想要半破解，可以使用 jQuery 的“document.ready”事件，并检查输入的高度。

编辑：作为对 Aviator 上述问题的回答...您可以只使用 asp:LinkButton，并将图像作为内容包装在其中...然后使用LinkButton 的 OnCommand 事件。

【讨论】：

【解决方案2】：

它具有相同的 onerror 事件。这个对我有用（至少在 chrome 中）：

<input type="image" onerror="alert(1);" src="http://xxx" />

另一种可能的方式是在JS中加载图片：

关于文件加载：

$('input[type="image"]').each(function(){
    var img = new Image();
    var input = this;
    img.onerror = function() { Image_OnError(input); }
    img.src = this.src;
})

另外，您最好从一开始就隐藏它们，只显示成功加载图像的元素。否则你可能会有元素在页面上跳转。

【讨论】：

是的，我应该说，我在 chrome 上测试过它，它工作正常，但 IE 一如既往地是另一个故事......
你可以尝试用 JS 加载 img。至少这不会在 html 中引入额外的