在用户即将离开导航页面时拦截

问：

我想在用户即将离开我网站的产品页面时进行拦截，以使个性化消息出现在模态中。

我尝试了“beforeunload”事件处理程序，但在 FireFox 中，它出现了一条关于希望离开页面的确认消息，这是浏览器默认的，并且只能自定义文本; 在 Edge 中，不显示离开页面的确认消息，但允许用户继续在其他地方浏览，而不考虑 preventDefault（）。

是否有其他事件处理程序或方法可以使此模式显示而不从浏览器获得警告？

谢谢！

   window.addEventListener('beforeunload', (e) => {
      e.preventDefault();
      let page_name = prestashop.page.page_name;

      if (page_name == 'index') {
        const modalProductPage = `
  <div class="jumbotron">
  <h1 class="display-4">Hello, world!</h1>
  <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
  <hr class="my-4">
  <p>It uses utility classes for typography and spacing to space content out within the larger container.</p>
  <p class="lead">
  <a class="btn btn-primary btn-lg" href="#" role="button">Buy</a>
  </p>
  </div>
  `
        setTimeout(() => {
          console.log('event attived!')
          $('.modal-body').html(modalProductPage)
          $('#exampleModalCenter').modal('show')
        }, 500);

      }
    })