我检测到损坏的图像并损坏了src并将它们存储到对象中，但无法将它们存储到对象中，因为我认为错误函数和将它们捕获到对象之间存在时间差请检查我的代码。
我成功获得了 src，但无法将它们存储在对象变量中并通过 ajax 将它们传递到后端。通过调试测试它，我认为
brokenImages.current_url = currentUrl;
brokenImages.broken_src = brokenSrc;
在错误函数之前运行，我在破碎的图像变量中什么也没得到。
jQuery(document).ready(function($){
//Check Image Error
var i = 0;
var currentUrl = window.location.href;
var brokenImages = new Object();
var brokenSrc = new Object();
$('img').on('error', function(event){
var link = event.target.src;
console.log('check '+link + ' num ' + i);
brokenSrc[i] = link;
i++;
});
//alert(brokenSrc);
//Like if I put alert brokenSrc object here I get them in ajax and php
console.log(' broken src ');
console.log(brokenSrc);
brokenImages.current_url = currentUrl;
brokenImages.broken_src = brokenSrc;
console.log( ' broken images ' );
console.log(brokenImages);
在chrome和Firefox的控制台日志中，我可以看到对象和srcs 但是当 Ajax 发送它们并将它们捕获到 PHP 中时，有 没有broken_src
//Sent Script Data
$.ajax({
type: "POST",
url: ajax_url,
data: {
imageData: brokenImages
},
success: function(result){
console.log(result);
}
});
});
无法在成功获取它们时将它们存储在损坏的图像变量中。
>.error已被弃用，需要改用.on('event'。
允许error是异步的，您的代码不会等待加载图像来发送损坏图像的最终报告。此外，img 上的空 src 属性不会触发错误或成功，您需要忽略或单独添加它们。我在下面的代码中忽略了它们。
$(document).ready(function() {
//Check Image Error
var i = 0;
var brokenSrc = [];
var totalImagesOnPage = $('img').not( "[src='']" ).length;
$('img').on('load', function() {
increaseCount();
}).on('error', function() {
var link = $(this).attr('src');
console.log('broken link : ' + link);
brokenSrc.push(link);
increaseCount();
});
function increaseCount() {
i++;
if (i == totalImagesOnPage) {
finishedLoadingImages();
}
}
function finishedLoadingImages() {
console.log("Broken images ::", brokenSrc);
$.ajax({
type: "POST",
url: '/',
data: {
imageData: {
current_url: window.location.href,
broken_src: brokenSrc
}
},
success: function(result) {
console.log(result);
}
});
}
});<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
</head>
<body>
<img src="" />
<img src="http://google.com" />
<img src="https://dab1nmslvvntp.cloudfront.net/wp-content/uploads/2014/05/1399880336proe-pic_400x400-96x96.jpg" />
<img src="https://simplyaccessible.com/wordpress/wp-content/themes/sa-wp-2014/images/logo.svg"/>
</body>
</html>$('img').error抛出异常的原因是$('img').error实际上不是一个函数。但是，如果要捕获图像加载失败，可以使用如下onerror：
$(function(){
var error_object_array = [];
$('img').on('error', function(event) {
error_object_array.push(event.target.src);
});
})