调用 iFrame 按钮，然后调用父按钮

Question

我在 iFrame 中有一个按钮，在父级中有一个按钮 window。 iFrame 内的按钮由父 window 触发。我有一组要从两个按钮执行的代码。一部分代码特定于 iFrame，一部分代码特定于 Parent window。我能够触发 iFrame 按钮，但问题是父 window 代码在 iFrame 按钮完成其操作之前运行。

请帮我实现这个。

请提出建议并提前致谢。

Answer 1

你可以这样做，

$("#btnButton2").hide();
$("#btnButton2").click(function () {
    setTimeout(function () {
        console.log("Hello from Button 2");
    }, 3000);
});

$("#btnButton1").click(function () {
    setTimeout(function () {
        console.log("Hello from Button 1");
        $("#btnButton2").show().click();
    }, 6000);
});

Fiddle

Answer 2

在外部文档中，设置 button2 以创建一个包含您要在 button1 完成后执行的动作链的新事件，并将其分派给内部按钮。

根据您要执行的操作，您可能必须在此点击处理程序中声明延迟操作所需的任何变量，以便它们成为闭包的一部分。

$(function(){
    $("#button2").click(function(e){
        var action = function() {
            setTimeout(function(){alert("button2 action")},6000);
        }
        var innerButton = $("iframe#frame").contents()
            .find("#button1");
        e.detail = action;
        var evt = new CustomEvent('click',e);
        innerButton[0].dispatchEvent(evt);
    });
});

在内部文档中，在执行按钮单击的正常操作后，检查事件是否传递了其他操作，然后执行它们。

$(function () {
    $("#button1").click(function (evt) {
        setTimeout(function () {
            alert("button1 click");
            if (typeof evt.originalEvent.detail == 'function') evt.originalEvent.detail(evt);
        }, 3000);
    });
});

这里有一对 jsFiddle，其中一个用于 inner, and another one for the outer，其中包含一个（不是很清晰）iframe 的内部。

调用 iFrame 按钮，然后调用父按钮

Call iFrame button and then parent button

javascript

jquery

callback

jquery-callback