当文件不存在时，如何在 Javascript 中得到 try/catch 错误？

Question

我通过调用 local 文件（不是 URL）在元素中使用 Javascript 替换背景图像。

如果此文件不存在，我想尝试捕获错误。

所以我尝试了以下代码：

    try {
        thing.style.backgroundImage = str;
    }
    catch (err) {
        console.log(err.message);
        thing.style.backgroundImage = "none";
    }

然而，即使是无意义的文件名似乎也可以通过并且不会产生错误。更糟糕的是，有时显示的背景图像是空的，有时是以前调用的图像。

这里有什么办法try/catch报错吗？

Answer 1

我会用 and use an Image() constructor 来获取图像。如果你这样做了，你真的不需要 try-catch；您可以调用相应的函数来设置背景图像。

你可以这样做：

var img = new Image();
img.src = "pathToImage";

img.onerror = function(){ // Failed to load
    thing.style.backgroundImage = "none";
};
img.onload = function(){ // Loaded successfully
    thing.style.backgroundImage = img.src;
};

Answer 2

您也可以尝试使用 AJAX 而不是创建图像对象并将事件侦听器绑定到图像的错误和加载事件。在使用 AJAX 时，如果您使用的是服务或提供动态图像的东西，您还可以依赖状态代码，这取决于您希望如何操作所有内容。

查看此垃圾箱，看看它是否适用于您的用例。

http://jsbin.com/tezabupeli/18/edit?js,output

当文件不存在时，如何在 Javascript 中得到 try/catch 错误？

How to get a try/catch error in Javascript when file doesn't exist?

javascript

css

file

try-catch