JQuery-检查IMG src是否有效

JQuery - Check to see if an IMG src is valid

本文关键字:是否 有效 src IMG 检查 JQuery-      更新时间:2024-05-24

是否可以使用jquery检查img src是否有效?

我们有一个动态网站,里面有数百篇新闻文章,其中大部分都包含图像,基本上有一个后端错误,即使目前没有图像,也会显示图像div,这给我们带来了一些问题。

  <div class="imgBlock">
      <img class="newsImg" src="db/imgart/10234.jpg" />
  </div>

是否可以通过JQuery脚本检测img src是否正在传递图像?

function IsValidImageUrl(url) {
$("<img>", {
    src: url,
    error: function() { alert(url + ': ' + false); },
    load: function() { alert(url + ': ' + true); }
});
}

使用如下错误处理程序:

$(".newsImg").error(function() {
  alert("No image");
});

var image = new Image(); 
image.src = "db/imgart/10234.jpg";
if (image.width == 0) {
  alert("No image");
}

使用简单的css:

    <style type="text/css">
    .hidden {
    display: none;
    {
     .visible {
            display: block;
     }
    </style>

然后编写脚本

var imgDiv = document.getElementById('img1'); //your div id
    var imgsrc = "db/imgart/10234.jpg"; //or document.getElementById(img1).getElementsByTagName('img');
    var img = new Image();
    img.onerror = function (evt){
    alert(this.src + " can't be loaded.");
    //hide <div>
    imgDiv.setAttribute('class', 'hidden');
    }
    img.onload = function (evt){
    alert(this.src + " is loaded.");
    //show div
    imgDiv.setAttribute('class', 'visible');
    }
    img.src = imgsrc;