如何在另一个(新打开的)选项卡中运行脚本?

时间:2018-07-12 16:36:54

标签: javascript window.open

我正在尝试在新标签页中运行脚本。我使用的代码是这样的:

$ = jQuery;
function openAndPush(url, id) {
    var win = window.open('https://example.com' + url + '?view=map');
    var element = $('<script type="text/javascript">console.log("Starting magic...");var region_id='+id+';$=jQuery;var p=$(\'div["se:map:paths"]\').attr(\'se:map:paths\');if(p){console.log("Found! pushing..."); $.get(\'https://localhost:9443/addPolygon\', {id: region_id, polygon: p}, function(){console.log("Done!")})}else{console.log("Not found!");}</script>').get(0);
    setTimeout(function(){ win.document.body.appendChild(element); 
    console.log('New script appended!') }, 10000);
}

考虑以下几点:

  • 我受到this answer的启发,但改用jQuery。
  • 我在检查器/控制台中从https://example.com的另一页运行此代码(是的,实际域不是example.com-但相对于原始选项卡,目标url始终位于同一域中)以避免CORS错误。
  • 当我运行函数(例如openAndPush('/target', 1)),然后在另一个检查器中检查代码时,该代码用于 new 窗口,控制台消息{ {1}}未显示(我等待10秒钟甚至更多)。但是,新的DOM元素(我正在创建的脚本)显示在“元素”选项卡中(并且在 first 控制台/检查器中,我可以看到Starting magic...消息)。

(在两种情况下都存在New script appended!,但没有占用jQuery标识符,该标识符似乎是未定义的-因此我手动使用它)

我得出的结论是我的脚本未在新窗口中执行。

我想念什么?如何确保代码正在执行?

2 个答案:

答案 0 :(得分:5)

而不是将脚本元素嵌入文档中,为什么不将要在另一个选项卡中运行的代码包装到一个函数中并将其绑定到新选项卡的窗口,然后调用该函数。这是我在我的代码中运行的代码浏览器的控制台,它对我有用,即打开了另一个标签并显示了警报。

function openAndPush(url, id) {
    var win = window.open('https://www.google.com');
    win.test = function () {
        win.alert("Starting magic...");

    }
    win.test();
    setTimeout(function () {
        win.document.body.appendChild(element);
        console.log('New script appended!')
    }, 10000);
}

答案 1 :(得分:0)

发现我的错误在于创建新脚本节点时引用的原始文档,而不是目标文档(即integration)。我需要的是更改代码以引用新文档并直接创建节点,而在那个点的中间没有jQuery。所以我这样修改了代码:

win.document

使用此代码本质上正在发生一些事情:正在新文档的上下文中解析JS代码(并创建了其节点)。较早的替代方法涉及原始控制台(因为原始文档被隐式引用)。