Javascript 如何正确地在img onerror回调上递归调用函数？

我正在尝试通过构造图像的路径和文件名来设置图像src

这是我的代码：

var extensions = ["jpg", "jpeg", "JPG","JPEG","png","PNG", "gif", "GIF"];
var i=0;
var img = document.querySelector("img");
var testImages= function() {
    img.src = "Wildschwein_Sus_scrofa."+extensions[i];
    i++;
    if (i<extensions.length)
        img.onerror = testImages;
}

testImages();

似乎只处理最后一个扩展，因为我得到：

GET file:///home/beol/Desktop/Wildschwein_Sus_scrofa.GIF net::ERR_FILE_NOT_FOUND

如果我这样做：

img.onerror = testImages();

该函数被无限次递归调用

---

有人能告诉我y代码有什么问题吗？

也许你的意思是-在设置src之前，你确实需要分配处理程序：

var extensions = ["jpg", "jpeg", "JPG","JPEG","png","PNG", "gif", "GIF"];
var i=1;
var img = document.querySelector("img");
img.onerror = function() {
    console.log("error:"+this.src);
    if (i<extensions.length) img.src="Wildschwein_Sus_scrofa."+extensions[i];
    i++;
}
img.onload=function() {
    console.log("success:"+this.src);
}
img.src="Wildschwein_Sus_scrofa."+extensions[0];

var extensions=[“jpg”、“jpeg”、“jpg”、“jpeg”、“png”、“png”、“gif”、“gif”]；
var i=1；
var img=document.querySelector（“img”）；
img.onerror=函数（）{
log（“错误：+this.src”）；
如果（i可能您的意思是-您确实需要在设置src之前分配处理程序：

var extensions = ["jpg", "jpeg", "JPG","JPEG","png","PNG", "gif", "GIF"];
var i=1;
var img = document.querySelector("img");
img.onerror = function() {
    console.log("error:"+this.src);
    if (i<extensions.length) img.src="Wildschwein_Sus_scrofa."+extensions[i];
    i++;
}
img.onload=function() {
    console.log("success:"+this.src);
}
img.src="Wildschwein_Sus_scrofa."+extensions[0];

var extensions=[“jpg”、“jpeg”、“jpg”、“jpeg”、“png”、“png”、“gif”、“gif”]；
var i=1；
var img=document.querySelector（“img”）；
img.onerror=函数（）{
log（“错误：+this.src”）；
如果（i我建议进行此更改：

var extensions = ["jpg", "jpeg", "JPG","JPEG","png","PNG", "gif", "GIF"];
var i=0;
var img = document.querySelector("img");
var testImages= function() {
    if (i<extensions.length) {
        img.src = "Wildschwein_Sus_scrofa."+extensions[i];
        i++;
    }
}
img.onerror = testImages;
testImages();

var extensions=[“jpg”、“jpeg”、“jpg”、“jpeg”、“png”、“png”、“gif”、“gif”]；
var i=0；
var img=document.querySelector（“img”）；
var testImages=函数（）{
如果（i我建议进行此更改：

var extensions = ["jpg", "jpeg", "JPG","JPEG","png","PNG", "gif", "GIF"];
var i=0;
var img = document.querySelector("img");
var testImages= function() {
    if (i<extensions.length) {
        img.src = "Wildschwein_Sus_scrofa."+extensions[i];
        i++;
    }
}
img.onerror = testImages;
testImages();

var extensions=[“jpg”、“jpeg”、“jpg”、“jpeg”、“png”、“png”、“gif”、“gif”]；
var i=0；
var img=document.querySelector（“img”）；
var testImages=函数（）{
如果（i）
这对我有用

这对我来说很有效。
我认为OP的意思正好相反：如果加载失败，而不是加载正确，请尝试另一个扩展。问题是他在设置src后在循环中分配错误处理程序。为什么这是一个问题？你的意思是在设置src之前必须设置处理程序，因为图像可能会立即加载？因为se它不会执行，因为错误已经命中。但它会在下次触发。是的，正如我在回答中指出的。总是在触发处理程序之前分配处理程序我不知道发生了什么，但因为你是第一个回答问题的人，我会接受你的回答。我认为OP的意思正好相反：如果加载失败，请尝试另一个扩展s失败，如果加载正确则不会。问题是他在设置src后在循环中分配错误处理程序。为什么这是一个问题？你的意思是在设置src之前必须设置处理程序，因为映像可能会立即加载？因为它不会执行，因为错误已经命中。它将在下次设置src时触发是的，正如我在回答中指出的。在触发处理器之前，请始终指定处理器。我不知道发生了什么，但既然你是第一个回答问题的人，我会接受你的回答。谢谢，伙计，但我知道我得到了：getfile:///home/lucas/Desktop/Wildschwein_Sus_scrofa.jpg net:：ERR_文件未找到并获取file:///home/lucas/Desktop/Wildschwein_Sus_scrofa.GIF net:：ERR_FILE_未找到，因此似乎只处理数组的第一项和最后一项。您可能使用的浏览器是什么？所有扩展名上都有错误，如我的控制台中所示。再次感谢，我没有在问题中添加JSFIDLE，因为代码在JSFIDLE中运行良好，并且数组的所有项都已处理。我不知道为什么它能在JSFIDLE中工作。我的浏览器是：Chrome版本41.0.2272.76 Ubuntu 14.04（64位）谢谢，伙计，但我知道我得到了：得到file:///home/lucas/Desktop/Wildschwein_Sus_scrofa.jpg net:：ERR_文件未找到并获取file:///home/lucas/Desktop/Wildschwein_Sus_scrofa.GIF net:：ERR_FILE_未找到，因此似乎只处理数组的第一项和最后一项。您可能使用的浏览器是什么？所有扩展名都有错误，如我所见再次感谢，我没有在问题中添加JSFIDLE，因为代码在JSFIDLE中运行良好，数组的所有项都已处理。我不知道为什么它在JSFIDLE中运行。我的浏览器是：Chrome版本41.0.2272.76 Ubuntu 14.04（64位）谢谢你，伙计，其他的答案是，我得到了：得到file:///home/lucas/Desktop/Wildschwein_Sus_scrofa.jpg net:：ERR_文件未找到并获取file:///home/lucas/Desktop/Wildschwein_Sus_scrofa.GIF net:：ERR_FILE_NOT_FOUND，因此似乎只处理数组的第一项和最后一项，但我可以看到所有八个扩展名的ERR_FILE_NOT_FOUND。您愿意吗想再次检查吗？清除缓存可能会有所帮助。我在Chrome和Chrome中再次检查，但我只得到第一个和最后一个项目的错误。谢谢，伙计，其他答案是：getfile:///home/lucas/Desktop/Wildschwein_Sus_scrofa.jpg net:：ERR_文件未找到并获取file:///home/lucas/Desktop/Wildschwein_Sus_scrofa.GIF net:：ERR_FILE_NOT_已找到，因此似乎只处理数组的第一项和最后一项，但我可以看到所有八个扩展名都未找到错误文件。是否要再次检查？清除缓存可能会有所帮助。我在Chrome和Chrome中再次检查，但我只得到第一项和最后一项的错误。
var extensions = ["jpg", "jpeg", "JPG","JPEG","png","PNG", "gif", "GIF"];
var i=0;
var img = document.querySelector("img");
var testImages= function() {
    if (i<extensions.length) {
        img.src = "Wildschwein_Sus_scrofa."+extensions[i];
        i++;
    }
}
img.onerror = testImages;
testImages();

var extensions = ["jpg", "jpeg", "JPG","JPEG","png","PNG", "gif", "GIF"];
var i=0;
var img = document.querySelector("img");
var testImages= function() {
    img.src = "Wildschwein_Sus_scrofa."+extensions[i];
    i++;
    if (i>=extensions.length)
        img.onerror = null;
}
img.onerror = testImages;
testImages();