Question

我有一个父母将一系列孩子加载到iframe中。我将所有父j的js移动到外部js文件中以清理一些东西。但是，现在我无法连接其中一个孩子的某个功能。

我在父母中有一个音频标签，当它完成时，需要检查每个孩子是否在屏幕上以及是否存在自定义功能。但是，它给出了一个错误，即函数未定义。以下是来自父母外部js的示例代码。它不知道＆＃39; pageThreeCustom＆＃39;是一个功能。我确定我没有正确路径，我添加了document.getElementById来定位孩子所在的iframe ID而没有运气。

var audio = document.getElementById('audio');

audio.addEventListener('ended', function(){
    console.log("audio ended.");

    //ON AUDIO END
    if ($('#a1').isOnScreen()) {
        //example audio swap
        //$(audio).attr('src', "audio/tts/COC_2018_slide1a.mp3");
    }
    else if ($('#a2').isOnScreen()) {
    }
    else if ($('#a3').isOnScreen()) {
        //find page function
        document.getElementById("p3").contentWindow.pageThreeCustom();
    }

Answer 1

您可以尝试将此代码段放入此代码片段，以检查浏览器是否正在查找框架及其contentWindow属性：

console.log(document.getElementById('p3').contentWindo‌w);

您可能还想尝试使用窗口对象而不是文档：

console.log(window.frames.p3);

或直接进入方法调用：

window.frames.p3.pageThreeCustom()

第三种可能性是iframe内容尚未加载，导致iframe加载的原因是什么？如果它在页面加载时发生，您可以尝试等待窗口onload事件被触发，然后再尝试访问框架中的方法。

本期中解释了一些可能的解决方案： Calling javascript function in iframe

从父母的外部JS

1 个答案: