Javascript 防止函数的一部分运行直到其他部分完成

Question

我有一个用于重新加载 iframe 的函数，我希望它在重新加载 iframe 后而不是同时做更多的事情。

var heightArray = [];

function changeScroll() {
    console.log(Number(heightArray[0]));
    $('#vidList').contents().scrollTop(Number(heightArray[0]));
}

function changeVideo(source, title, desc) {
    heightArray = [];
    $("#current-video_html5_api").attr('src', source);
    $(".vidTitle").html(title);
    $(".vidDesc").html(desc);
    document.getElementById('vidList').contentWindow.location.reload();
        //Stuff I want to happen after ^ this happens
    var vidListHeight = $('#vidList').contents().scrollTop();
    heightArray.push(vidListHeight);
    console.log(heightArray);
    changeScroll();
}

我将如何去做，以便在document.getElementById('vidList').contentWindow.location.reload();之后出现changeVideo()中的所有document.getElementById('vidList').contentWindow.location.reload(); 实际上发生在它之后。 换句话说，我如何让函数在运行下一个之前单独完成每件事（即首先清除 heightArray，然后更改curreent-video_html5_api的源等）

Answer 1

您的所有代码都同步运行，而不是重新加载框架。

因此，在重新加载该帧后需要异步调用后，您需要调用需要运行的代码。

Frame 有您可以订阅的onload事件：

document.getElementById('vidList').load = function() {
var vidListHeight = $('#vidList').contents().scrollTop();
    heightArray.push(vidListHeight);
    console.log(heightArray);
    changeScroll();
};