实现点击空白处（任意地方）关闭iframe中弹框

实现点击空白处（任意地方）关闭iframe中弹框

不知道你有没有遇到过点击空白处（任意地方）关闭iframe中的弹框需求，如果有下面的代码可以帮到你~

<iframe
  id="iframeID"
  :src="fillFormUrl"
  :height="iframeHeight"
  frameborder="no"
  scrolling="auto"
></iframe>

const iframOverlayClose = () => {
    // 注意：需保证同源策略，不能跨域
    let iframe: any = document.getElementById('iframeGo');
    let iframeDoc: any;

    // 兼容不同浏览器的获取方式
    if (iframe.contentDocument) {
      iframeDoc = iframe.contentDocument;
    } else if (iframe.contentWindow) {
      iframeDoc = iframe.contentWindow.document;
    }
    // .cxd-PopOver-overlay为要模拟点击dom的className，例如遮罩层、弹窗关闭按钮
    let overlayElement = iframeDoc.querySelector('.cxd-PopOver-overlay');
    if (overlayElement) {
      let clickEvent = new MouseEvent('click', {
        'view': window,
        'bubbles': true,
        'cancelable': true
      });
      overlayElement.dispatchEvent(clickEvent);
    }
}

将iframOverlayClose绑到要点击dom click上即可