图像源在IE中显示为未定义但在Chrome中有效

Question

我正在尝试显示数组中包含的多个图像（PrinurlonPage），并将它们随机放置在页面上。我有两个问题，

• 第一个也是最重要的是，当我在开发人员工具上查看源属性时，我无法显示IE上显示的图像我看到未定义，而在chrome中，我获得了传递的完整URL 。我想知道导致问题的脚本运行顺序是否有问题。

• 第二个问题是关于在页面上随机定位图像并防止重叠，我想知道如何实现这一点，我在目前的一些迭代中实现的图片重叠。

我很感激有关此

的任何建议

＆＃13;

＆＃13;

var getIndividualPersonDetails = function(GetPictureUrl, printurlonPage, getRandom) {
  listName = 'TeamInfo';
  var PeopleCompleteList = [];
  var personName, userName, UserTitle, UserphoneNumber, UserEmail, Id, myuserPicture;

  // execute AJAX request
  $.ajax({
    url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items?$select=Name/Title,Name/Name,Name/Id,Name/EMail,Name/WorkPhone&$expand=Name/Id",
    type: "GET",
    headers: {
      "ACCEPT": "application/json;odata=verbose"
    },
    success: function(data) {

      for (i = 0; i < data.d.results.length; i++) {
        //check if the user exists if he does store the following properties name,title,workphone,email and picture url
        if (data.d.results[i]['Name'] != null) {
          personName = data.d.results[i]['Name'].Name.split('|')[2];
          userName = data.d.results[i]['Name']['Name'];
          UserTitle = data.d.results[i]['Name']['Title'];
          UserphoneNumber = data.d.results[i]['Name']['WorkPhone'];
          UserEmail = data.d.results[i]['Name']['EMail'];
          Id = data.d.results[i]['Name']['Id'];
          myuserPicture = GetPictureUrl(userName);
          PeopleCompleteList.push(PersonConstructor(personName, UserTitle, UserphoneNumber, UserEmail, myuserPicture, Id));
        }
      }

      PeopleObject = PeopleCompleteList;
      PrinturlonPage(PeopleCompleteList, getRandom);

    },
    error: function() {
      alert("Failed to get details");
    }
  });
}


//print all the image links in the peopleCompleteList array and then position them randomly on the page
var PrinturlonPage = function(PeopleCompleteList, getRandom) {
  var imageList = [];


  for (i = 0; i < PeopleCompleteList.length; i++) {
    var top = getRandom(0, 400);
    var left = getRandom(0, 400);
    var right = getRandom(0, 400);
    imageList.push('<img style="top:' + top + ';right:' + right + '" id="image' + PeopleCompleteList[i]['UserId'] + '" alt="' + PeopleCompleteList[i]['Title'] + '"class="imgCircle" src="' + PeopleCompleteList[i]['Picture'] + '"/>');
    //imageList +='<img class="img-circle" src="'+PeopleCompleteList[i]['Picture']+ '"/>'  
  }
  var imagesString = imageList.join().replace(/,/g, "");
  $('#imageList').append(imagesString);
}

//funtion retrieves the picture
function GetPictureUrl(user) {
    
            var userPicture="";
            var imageurls="";
            var requestUri = _spPageContextInfo.webAbsoluteUrl +
                             "/_api/SP.UserProfiles.PeopleManager/GetPropertiesFor(accountName=@v)?@v='"+encodeURIComponent(user)+"'";

                     $.ajax({
                            url: requestUri,
                            type: "GET",
                            async:false,
                            headers: { "ACCEPT": "application/json;odata=verbose" },
                            success: function (data) {
                                console.log(data);
                               var loginName = data.d.AccountName.split('|')[2];
                               console.log(loginName);
                              var PictureDetails = data.d.PictureUrl != null ? data.d.PictureUrl : 'https://xxxcompany/User%20Photos/Profile%20Pictures/zac_MThumb.jpg?t=63591736810';
                              imageurls = data.d.PersonalSiteHostUrl+'_layouts/15/userphoto.aspx?accountname='+ loginName+ '&size=M&url=' + data.d.PictureUrl;
                              userPicture1=imageurls;
                            }

                       });
                return userPicture1;

}

var getRandom = function(x, y) {
  return Math.floor(Math.random() * (y - x)) + x + 'px';
};

$(function() {
  getIndividualPersonDetails(GetPictureUrl, PrinturlonPage, getRandom);

  $(document).on('click', '.imgCircle', function() {
    var theName = jQuery(this).attr('Id');
    pullUserObject(theName);
    //console.log(theId);
  });



});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="imageList"></div>

＆＃13;

＆＃13;

＆＃13;