Javascript 通过jquery ajax检查图像是否存在？

该脚本使用API访问数据库中的信息，并为数据库中的随机人员显示“聚光灯”，其中包括他们的姓名、照片和简短的个人简历

我试图写这个脚本来检查图像是否存在。如果映像存在，则脚本应继续，但如果映像不存在（404错误），则应重新滚动并再次检查。我在理解如何使用ajax的异步部分时遇到了一些问题

        function checkImage(imgurl){
           function headRequest(url){
               return $.ajax({  //Makes a HEAD request for the image
                   url: url,
                   type: 'HEAD'
               });
            };
            headRequest(imgurl)
            .done(function(){
                return true; //image exists
             })
            .fail(function(){
                return false; //HEAD request returns 404
             });
        };

    //if image does not exist or person.biography is undefined, reroll
    while (!checkImage(imgsrc) || person.biography == undefined) {
        //select random person
    }

必须使用回调！（无法从

异步调用返回）

并调用函数：

checkImage(imgsrc, function(exists) {
    //exists is what you passed into the callback
    if (exists) { //do stuff

    } else {
        //doesnt
    }
});

因此，通过这种方式，它会不断迭代调用，直到找到匹配项为止。例如，可能会这样运行：

var firstPerson = GetNewRandom();  //Initial person
function myCallback(url) {
    $('#myImage').attr('src', url);  //Change src to successful image
}
checkImage(firstPerson, myCallback); //starting with this person, look for a match

因此，我最终将异步部分设置为false。我知道这不是好的做法，但这是过渡时期的最佳解决方案

    function checkImage(imgurl){
        function headRequest(url){
            var http = $.ajax({
                url: url,
                type: "HEAD",
                async: false
            })
            return http.status;
        }
        if(headRequest(imgurl) == 200) {
            return true;
        }
        else {
            return false;
        }
    }
    //if image does not exist or person.biography is undefined, reroll
    while (!checkImage(imgsrc) || person.biography == undefined) {
        //reroll
    }

为什么不使用递归？你应该读一下：@HorsSujet是的，我已经看过了，但是我在理解回调方面有困难。在这种情况下，你不应该使用while循环。如果你失败了，你只需要再次调用checkImage，再加上一个“roll”。我这里的问题是当没有有效的“roll”时会发生什么？您想限制重新回滚的次数吗？我尝试使用jQueryAjax成功和错误回调函数，并将async设置为false，但循环仍在继续？
var firstPerson = GetNewRandom();  //Initial person
function myCallback(url) {
    $('#myImage').attr('src', url);  //Change src to successful image
}
checkImage(firstPerson, myCallback); //starting with this person, look for a match

    function checkImage(imgurl){
        function headRequest(url){
            var http = $.ajax({
                url: url,
                type: "HEAD",
                async: false
            })
            return http.status;
        }
        if(headRequest(imgurl) == 200) {
            return true;
        }
        else {
            return false;
        }
    }
    //if image does not exist or person.biography is undefined, reroll
    while (!checkImage(imgsrc) || person.biography == undefined) {
        //reroll
    }