当文档失去焦点时,动态添加图像会中断

时间:2017-07-26 21:00:58

标签: javascript html node.js d3.js frontend

我正在使用JSON将图像添加到div中。最多,div中只包含5个图像。但是,如果我转到另一个选项卡或文档失去焦点,脚本会向div添加5个以上的图像。即使文档失去焦点,脚本是否可以正常工作?

let temp = true; 

for (let key in orders) {
   if (orders[key].orders && orders[key].orders[0] && orders[key].orders[0].imageId && temp) {
      for (let i = 0; i < orders[key].orders.length; i++) {
         if (imageArray.indexOf(orders[key].orders[i].imageId) < 0) {
            imageArray.push(orders[key].orders[i].imageId);
            elem = document.createElement('img');
            elem.src = imageUrl + orders[key].orders[i].imageId + '._SR' + imageWidth + '_.jpg';
            if (checkboximage.checked == false) {
               elem.className = 'visToggle';
            }
            elem.addEventListener('load', function() {
               this.classList.add('imagesFadeIn');
            });
            elem.title = orders[key].orders[i].brand + ' - ' + orders[key].orders[i].style;
            rightImages.appendChild(elem);
            temp = false;
            break;
          }
       }
     } else {
       break;
   }
}

let imgs = rightImages.getElementsByTagName('img');
if (imgs.length > 5) {
   fadeOut(rightImages.firstElementChild);
   imageArray.shift();
}

0 个答案:

没有答案