资讯专栏INFORMATION COLUMN

项目中打开新窗口的3种方式

yacheng / 288人阅读

摘要:使用在当前窗口打开另一个窗口,在新开窗口中操作完成之后,关闭该窗口,在当前窗口中监听新窗口什么时候关闭,一旦检测到窗口关闭就执行回调。使用这种方式需要考虑浏览器的跨域问题,在上如果使用打开跨域了的窗口,是获取不到对象的。

1.使用iframe(注意Iframe的高度默认150px,如果要改变iframe的高度,只能设置成具体的像素值,不能是百分比)

2.使用window.open()直接打开外部窗口,在外部窗口中处理完成所有的操作后回到原来的页面,原来的页面出现一个确认是否完成操作的弹框。点击确认或者“cancel”之后接着调用其他的接口。

3.使用window.open()在当前窗口打开另一个窗口,在新开窗口中操作完成之后,关闭该窗口,在当前窗口中监听新窗口什么时候关闭,一旦检测到窗口关闭就执行回调。
使用这种方式需要考虑浏览器的跨域问题,在ie上如果使用window.open()打开跨域了的窗口,window.open()是获取不到window对象的。

detectCreditCardFilledOut: (callback, url, openWin) => {
  let creditCarWin = null;

  let s = null;

  const stopF = () => {
    clearInterval(s);
    creditCarWin = null;
    s = null;
    callback();
  };


  const checkCloseWindowOrNot= () => {
    if (creditCarWin != null && creditCarWin.closed) {
      stopF();
    }
  };


  const openCreditCard = () => {
    try {
      creditCarWin = openWin(url, "CreditCard");
      creditCarWin.focus();
      runF();
    } catch (e) {
      Util.NotificationUtil("error", {
        description: lang.openWindowError
      })
    }
  };

  const runF = () => {
    s = setInterval(checkCloseWindowOrNot, 500);
  };

  openCreditCard();
},

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/101897.html

相关文章

  • 浏览器拦截打开窗口情况总结

    摘要:在打开一个新窗口时,由于浏览器的安全机制,用户未始终允许的情况下,可能会触发到浏览器拦截,无法正常直接弹出。只分析使用代码手动打开新窗口的方式。所有浏览器都不允许非用户操作引起的打开新窗口。 在打开一个新窗口时,由于浏览器的安全机制,用户未始终允许的情况下,可能会触发到浏览器拦截,无法正常直接弹出。 网上有很多给出解决方案的只言片语,不够全面,所以针对自己遇到的问题做了详细的情况分析。...

    Steven 评论0 收藏0
  • 使用<a>标签时,你可能会忽略一个安全问题

    摘要:当一个外部链接使用了的方式,这个外部链接会打开一个新的浏览器。此时,新页面会打开,并且和原始页面占用同一个进程。笔者的总结这是一篇很短的文章,主要介绍了在使用标签打开一个新窗口过程中的安全问题。 本文首发于公众号: 符合预期的CoyPan本文章翻译于:https://medium.com/front-end-weekly/prevent-sending-http-referer-hea...

    rozbo 评论0 收藏0
  • 使用<a>标签时,你可能会忽略一个安全问题

    摘要:当一个外部链接使用了的方式,这个外部链接会打开一个新的浏览器。此时,新页面会打开,并且和原始页面占用同一个进程。笔者的总结这是一篇很短的文章,主要介绍了在使用标签打开一个新窗口过程中的安全问题。 本文首发于公众号: 符合预期的CoyPan本文章翻译于:https://medium.com/front-end-weekly/prevent-sending-http-referer-hea...

    zero 评论0 收藏0
  • 使用<a>标签时,你可能会忽略一个安全问题

    摘要:当一个外部链接使用了的方式,这个外部链接会打开一个新的浏览器。此时,新页面会打开,并且和原始页面占用同一个进程。笔者的总结这是一篇很短的文章,主要介绍了在使用标签打开一个新窗口过程中的安全问题。 本文首发于公众号: 符合预期的CoyPan本文章翻译于:https://medium.com/front-end-weekly/prevent-sending-http-referer-hea...

    stackvoid 评论0 收藏0
  • 理解HTTP session原理及应用

    摘要:理解原理及应用一术语在我的经验里,这个词被滥用的程度大概仅次于,更加有趣的是与在某些语境下的含义是相同的。其中的作用就是为了解决协议无状态的缺陷所作出的努力。 理解HTTP session原理及应用 一、术语session 在我的经验里,session这个词被滥用的程度大概仅次于transaction,更加有趣的是transaction与session在某些语境下的含义是相同的。 ...

    dreamGong 评论0 收藏0

发表评论

0条评论

yacheng

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<