如何使用jQuery从iframe的父页面调用函数？

Question

我有一个上传表单发布到隐藏的iframe。我试图从iframe的父页面上调用一个函数，但得到错误“top.stopUpload不是一个函数”。

这样做的正确方法是什么？

父页面：

$(document).ready(function() { 

    $('#document_upload').submit(function() { 

     $('#upload_progress').show(); 

    }); 

    function stopUpload(success){ 

     if (success == 1){ 
      $('#result', window.parent.document).html(
      '<span class="msg">The file was uploaded successfully!<\/span>'); 
     } 

     else { 
      $('#result', window.parent.document).html(
      '<span class="emsg">There was an error during file upload!<\/span>'); 
     } 

     $('#upload_progress').hide(); 

     return true; 

    } 

}) 

IFRAME：

$(document).ready(function() { 

    top.stopUpload(<?php echo $result; ?>); 

} 

Answer 1

你stopUpload()功能的作用范围是传递给$(document).ready()匿名函数。

您需要确保其范围对iframe可见。一种方法是将函数分配给window，即浏览器中的全局对象。

另一种方法是在匿名函数之外的全局代码中创建函数。

Answer 2

试试这个：

var myGlobalObject = {}; 
myGlobalObject.stopUpload = function(success){ 
if (success == 1){ /*...*/} 
    //... 
}; 
$(document).ready(function() { 
    //... 
}); 

在自己的iframe：

$(document).ready(function() { 
    parent.myGlobalObject.stopUpload(<?php echo $result; ?>); 
});