Question

我正在尝试从iframe中调用2个函数setListener();和addNewBox();。

我到处寻找并尝试了一切，我无法让它发挥作用。

我无法访问父级的头部，因为它是通过php require以块的形式构建的。

这是父文件的粗略模型。

<head>
<?php require "head.html" ?>
</head>
<body>
<?php require "content.html" ?>
</body>

content.html mockup：

<!-- a bunch of boring divs -->
<iframe src="image_editor.html"></iframe>
<script> /* random ajax */ </script>
<script>
$(document).ready(function(e) {
    //init
    setListener();
    addNewBox();

    function setListener()
    {
            //MAGIC HAPPENS
        }

        function addNewBox()
    {
            //GREATER MAGIC HAPPENS
        }
}
</script>

image_editor.html mockup：

<body>
<form id="image_form">
<input type="submit" value="Submit"/>
</form>
<script>
$(document).ready(function(e) {
    $("#image_form").submit(function(e) {
            //MAGIC HAPPENS HERE

            //re-adds listeners
            window.parent.addNewBox();
            window.parent.setListener();
        }
</script>
</body>

我尝试过在网上找到的所有解决方案，从使用top到以公共格式重新声明父级中的函数（window.myFunction = function（）{};）。

我很感激任何建议。

由于

更新：经过一些调试后，似乎调用不起作用的原因是因为执行在它们之前停止了一行。不知何故，这行“$（”。new“，window.parent.document）.remove（）;”打破一切。我现在必须想出那一个。我感谢你的帮助。

Answer 1

至少因为setListener()和addNewBox()不在window.parent的全球范围内而发生这种情况。要解决此问题，您需要将其移出$(document).ready(function(e) {...}())。

Answer 2

这是因为它们位于$(document).ready(function(){});

你可以这样解决：

$(window.parent).bind(setListener);
$(window.parent).bind(addNewBox);

希望它有所帮助！

无法从iframe调用父级函数

2 个答案: