最近公司的内部系统开发遇到一个问题,需要实现跨窗口的不同画面的获取焦点问题模型如下:
画面A通过window.open打开了画面B和画面C,然后想在点击画面B的按钮的时候,跳转到画面C。正常考虑的应该是通过window.focus()去解决,但是这里发现window.focus()只有在打开这个画面的原画面才生效,也就是在这个例子中,只有画面A调用画面B或者C的focus方法才能实现画面的跳转,但是由于画面C并不是由画面B打开的,所以画面B无法实现跳转到画面C。另外我发现就算是自己画面调用自己窗口的focus方法,大多数情况下也是不行的,这可能是为了防止恶意网站锁定自己网页的焦点,使用户无法离开当前窗口。也就是用户一旦离开当前窗口,即当前窗口失去焦点之后,很难通过js脚本实现窗口焦点的切换,除非是切换到由目当前活性化窗口通过window.open方法打开的窗口。
经过多次尝试,虽然window.focus不能实现窗口的自由切换,但是如果我们知道需要得到焦点的目标窗口的name的话,是可以通过window.open实现类似焦点切换的效果的,这个方法的第二个参数使window.name,当这个参数一致的时候,可以实现类似焦点切换的效果,不过这也有一个前提就是不能打开新的窗口(即不能指定一个不存在的windowname)一旦打开过一次新的窗口,那么后续即使指定了已经打开着的窗口的name,也不能实现跳转到对应窗口的效果。
回到上面的问题模型,就是在画面A的某个按钮的js脚本中,通过window.open(url,"windowB")打开画面B,这时候新打开的画面B会自动获取焦点,这时候在画面B没有办法通过window.focus使焦点回到画面A,但是可以通过执行window.open("","windowA").focus使画面的焦点回到画面A。对于同样是由画面A打开的画面C,也可以使用window.open("","windowB").focus使画面焦点切换到画面B。如果是想从画面A迁移到画面B或者C的话,则可以直接使用对应画面的focus方法,因为B或者C都是由画面A打开的,可以直接从打开的画面迁移到被打开的画面。
这里需要注意的是,画面B通过执行window.open("","windowA").focus使画面的焦点回到画面A有一个前提,执行的window.open必须是当前已经存在的画面,只要是已经存在的画面,那么焦点可以无限次迁移,一旦中途打开过未未存在的画面,那么后续的window.open都不会做到类似焦点切换的效果。
补充:
1.window.open只能跳转到同一个路由下的窗口,非同一路由的时候会新打开一个画面。(即新打开的浏览器窗口不能实现跳转到之前浏览器窗口下打开的一系列画面)
2.网上很多文章说window.close可以关闭通过window.open打开的画面,但实际发现不是通过window.open打开,而是通过网页快捷链接打开的也可以,我认为是当前画面没有前后履历的时候,就可以通过close方法关闭。
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 使用C#创建一个MCP客户端
· ollama系列1:轻松3步本地部署deepseek,普通电脑可用
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 按钮权限的设计及实现