Как сделать обратный вызов для асинхронной / ожидающей функции

Question

Моя асинхронная c функция в JavaScript читает файл и затем помещает результат в конкретный c div.

async function loadContent( id, file ) {
    var response = await fetch( file );
    var text = await response.text();
    document.getElementById( id ).innerHTML = text;
}

Я использую его вот так:

loadContent("pagesmaxspan", "../export/" + `<?php echo $randomid ?>` + ".variable");

но когда я пытаюсь получить переменную, она не будет работать

var myvar = $("pagesmaxspan").textContent; // <<--- this does not work

с задержкой, это будет выглядеть так:

var myvar = "";

setTimeout(function() {
    myvar = $("pagesmaxspan").textContent;
}, 100);

Как я могу сделать это без использования setTimeout

Answer 1

Когда вы вызываете loadContent, там нет await, поэтому вы просто получаете обещание от функции async, и выполнение кода продолжается.

Вот почему предложение от @Patrick выше работает, помещая код, который необходимо выполнить потом внутри then.

Answer 2

Чтобы предоставить пример для ответа @kshetline, это должно сработать.

loadContent("pagesmaxspan", "../export/" + `<?php echo $randomid ?>` + ".variable")
.then(() => {
   console.log($("pagesmaxspan").textContent);
})

Answer 3

Добавьте обратный вызов к функции loadContent

async function loadContent( id, file, callBack = false) {
    var response = await fetch( file );
    var text = await response.text();
    document.getElementById( id ).innerHTML = text;

    //check if callback is function
    if (callBack && callBack.constructor && callBack.call && callBack.apply)
    {
        callBack();
    }
}

, вызовите его с помощью

loadContent("pagesmaxspan", "../export/" + `<?php echo $randomid ?>` + ".variable",
 function(){
    var myvar = $("pagesmaxspan").textContent;
});