Js: Загрузка картинок в окно

141

11 мая 2018, 11:32

мне необходимо нажимая на ссылку, создавать программно окно в которое должна загружаться картинка, на другую ссылку ещё картинка и того уже 2 картинки. У меня 3 ссылки соответственно максимум может быть 3 картинки. + в конце должна быть кнопка закончить, которая закрывает окно.
У меня картинки загружаются, но одного типа и неопределённо много раз так же как и кнопка. Как это можно исправить? P.S. Извините, что так туплю, совсем новичок в этом

function OpenWin() { 
 
  var link_1 = document.getElementById('link_1'); 
  link_1.addEventListener('click', function() { 
      var newWindow = window.open("", "newWindow", "location = no"), 
        element = newWindow.document.createElement('button'); 
      element.innerHTML = 'Закончить', element.id = 'but', element.onclick = function() { 
        newWindow.close() 
      }; 
 
      var img_1 = newWindow.document.write('<img  
        src = "images/1.jpeg" > ');  
        // newWindow.document.body.appendChild(element); 
 
      }); 
 
    var link_2 = document.getElementById('link_2'); link_2.addEventListener('click', function() { 
      var newWindow = window.open("", "newWindow", "location = no"), 
        element = newWindow.document.createElement('button'); 
      element.innerHTML = 'Закончить', element.id = 'but', element.onclick = function() { 
        newWindow.close() 
      }; 
      var img_2 = newWindow.document.write('<img src="images/2.jpeg">'); 
 
    }); 
 
 
    var link_3 = document.getElementById('link_3'); link_3.addEventListener('click', function() { 
      var newWindow = window.open("", "newWindow", "location = no"), 
        element = newWindow.document.createElement('button'); 
      element.innerHTML = 'Закончить', element.id = 'but', element.onclick = function() { 
        newWindow.close() 
      }; 
      var img_3 = newWindow.document.write('<img src="images/3.jpg">'); 
      newWindow.document.body.appendChild(element); 
 
    }); 
 
 
    console.log(img_1, img_2, img_3); 
 
  }

body { 
  background: #4169E1; 
} 
 
a { 
  color: #FF0000; 
  font-size: 30px; 
  display: block; 
}

<a href="#" onclick="OpenWin()" id="link_1">Экзюпери</a> 
<a href="#" onclick="OpenWin()" id="link_2">Маленький принц</a> 
<a href="#" onclick="OpenWin()" id="link_3">Лис</a>