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(); 
} 

Как бы идти о том, чтобы это так все вещи в changeVideo(), которые появляются после того, как на самом деле document.getElementById('vidList').contentWindow.location.reload();произойдет после него. Другими словами, как заставить функцию заканчивать выполнение каждой вещи отдельно, прежде чем запускать следующую (то есть First, heightArray очищается, затем изменяется исходный код curreent-video_html5_api и т. Д.)

Answer 1

Весь ваш код работает синхронно, вместо перезагрузки Рамка.

Итак, вам нужно позвонить вам код, который вам нужно запустить после того, как вам потребуется асинхронно звонить после перезагрузки этого фрейма.

Рама имеет onload событие, которое вы могли бы подписаться на:

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