javascript - 如何在弹出窗口中单击按钮

Question

我的第一页上有按钮。

<button id="btm" onclick="window.open('page.htm', '_blank', 'toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400')">Button1</button>

我有另一个 page.htm，下面是 html

<button id="testbtn" onclick="window.open('http://www.ivikashjha.com', '_blank', 'toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400')">Button2</button>

我想在第一次点击按钮时打开网站 ivikasjha.com。 实际上我想访问主父页面上弹出页面的控件。

Answer 1

同域

浏览器内测试(Firefox 35)似乎表明如果打开的窗口在同一个域内，则该页面有一些访问权限

var child = window.open( 'http://example.com' )
child.localStorage.setItem( 'hello', 'there' ) // Sets correctly
child.$( 'body' ).css( 'background', 'blue' ) // Access denied to '$'

不同域

然而，跨域测试似乎将可用接口(interface)限制为 location , parent , postMessage , 和其他几个

var child = window.open( 'http://other-domain.com' )
child.localStorage // cannot access

window.postMessage可供您使用。在两个选项卡之间来回发布消息并不是最简单的方法，但至少您可以告诉弹出窗口单击它自己的按钮。

如果失败，则两个页面在后台打开共享 websocket 并以这种方式进行通信没有任何限制。

外卖

在选项卡之间传播功能的最简单方法似乎是消息发布:

//Parent page
var childUrl = 'http://hello.example.com' )
var child = open( childUrl )
child.postMessage( 'click-button', childUrl )

//Child page
window.addEventListener( 'message', function( event ){
  if( event.data === 'click-button' ){
    $( '#my-button' ).click()
  }
}, false )