Мне нужно показать изображения в другом окне. У меня есть 2 файла HTMLs:
В родительском HTML есть кнопка в HTML, которая динамически загружает данные из объекта JSON после зацикливания на нем:
//JASON object loop to generate a button to open each picture in a table
tabCell.innerHTML + = 'value = "Открыть картинку" onclick = "OpenPopup (' + myBooks [[col [j]] + ')" />';
В скриптовой части:
// open the popup and send the picture base64 image
var popup;
function OpenPopup(picData) {
popup = window.open("base64popup.html?picData="+picData, "Popup", "width=300,height=100");
SendToPopup(picData);
};
function SendToPopup(picData) {
if (popup != null && !popup.closed) {
popup.focus();
} else {
alert("Popup has been closed.");
}
}
//this is the popup html file
The popup page:
<html>
<script type="text/javascript">
//on load it receive the request param
window.onload = function loadPic(){
var pictureSource = getParameterByName('picData');
var divContainer = document.getElementById("approval_report");
//it adds the data in HTML to show it with encoding
divContainer.innerHTML +='<img src=data:image/jpeg;base64,'"'+pictureSource+'"/>';
};
//function to get param
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
</script>
<body>
<div id="approval_report" />
</body>
</html>
Этот результат отображает только первую часть изображения.
Есть идеи, как это все показать?
Я также могу изменить представление о всплывающем окне, мне нужно показать эту картинку в другом разделе, а не в основной таблице.