Вопрос достоин блондинки, ,т.к. JS для меня чужеродное, но необходимое.
Суть. Ниже пример кода.
Входная функция slideshow. В ней запускается функция creategalleryBoxViewBody. В этой функции я хочу получить данные, выполняя другую функцию data = getproddata(parseInt(link.dataset.prodid)) ; Для проверки пишу следующей строкой alert (data). Так же внутри функции getproddata так же для проверки вставляю alert ("Input" + data). Когда код выполняется, то сначала выводится alert (data) из функции creategalleryBoxViewBody, при этом переменная data не определена, хотя при трассировке, в строке data = getproddata(parseInt(link.dataset.prodid)) мы заходим в саму функцию getproddata, правда внутри этой функции не срабатывает alert.
Дальше код отрабатывается, выводится окно с картинкой и! выводится alert ("Input" + data) из getproddata с нужной информацией.
Вопрос: почему js работает не так, как я ожидаю? почему я не получаю значение при вызове data = getproddata(parseInt(link.dataset.prodid)) ;? Вообще не логично. Как же правильно?
function slideshow(evt) {
let link = evt.currentTarget ;
creategalleryBoxViewBody(link) ;
}
function creategalleryBoxViewBody(link) {
closegalleryBox() ;
var container = document.createElement('div') ;
data = getproddata(parseInt(link.dataset.prodid)) ;
alert (data)
container.innerHTML = '<div id="galleryBox_view" class="galleryBox"> \
<div class="galleryBox_content"> \
<span id="close_galleryBox" onclick="closegalleryBox()">×</span> \
<img src="' + link.src + '" alt="Картинка"> \
</div> \
</div>' ;
document.body.appendChild(container.firstChild) ;
}
function closegalleryBox() {
let galleryBox = document.getElementById("galleryBox_view");
if (galleryBox) { galleryBox.remove() ; }
return true ;
}
window.onclick = function(event) {
if (event.target == document.getElementById("galleryBox_view")) {
closegalleryBox();
}
}
//-----------------------------------------------
// ajax запросы
function status(response) {
if (response.status >= 200 && response.status < 300) {
return Promise.resolve(response)
} else {
return Promise.reject(new Error(response.statusText))
}
}
function json(response) {
return response.json()
}
function getproddata(prod_id) {
fetch('getproduct/'+prod_id)
.then(status)
.then(json)
.then(function(data) {
console.log('Request succeeded with JSON response', data);
alert ("Input" + data)
return (data) ;
}).catch(function(error) {
console.log('Request failed', error);
});
}
