javascript - 只有当它有标题时才显示img？

Question

基本上在我的 ASP.NET MVC4 项目中，我试图将我的验证消息作为工具提示（将鼠标悬停在某个图像上时会显示）。现在错误消息被插入到图像标题中 - 但是我只想在图像有标题时显示图像（当它没有标题时没有错误消息）。

我怎样才能做到这一点？

我认为通过 CSS 是不可能的，所以 js/jquery 解决方案也可以。

为了澄清，我需要检查在运行时标题更改时更新显示。初步检查不会这样做。

Answer 1

这是纯 CSS 解决方案。

CSS代码：

img{display:none;}
img[title]{display:block;}

这是一个工作演示

的HTML：

<img src="https://www.google.co.in/images/srpr/logo4w.png" />
<img src="https://www.google.co.in/images/srpr/logo4w.png" />
<img src="https://www.google.co.in/images/srpr/logo4w.png" title="" />
<img src="https://www.google.co.in/images/srpr/logo4w.png" />
<img src="https://www.google.co.in/images/srpr/logo4w.png" />

CSS：

img{display:none;}
img[title]{display:block;}

希望这是您正在寻找的。

Answer 2

只显示带有标题的图像？

$('img').filter(function(i, el){
    return !$(el).prop('title');
    // (empty/undefined titles evaluates as false)
}).hide();

这是你要求的吗？

也许这个 css 选择器就足够了（只适用于现代浏览器）：

img:not([title])
{
    display: none;
}