Question

在页面上，我有一个复杂的表单（许多字段，标签...），我想显示一条警告消息，警告用户是否他试图离开页面，是否他发布了表单（因为在编辑表单中，您设置了所有必填字段，但您可以修改或不修改值。）

我已经看到更改警报消息has been remove as Chrome 51的可能性并且无论如何都不适用于其他浏览器，但我想在页面更改之前显示一条消息，但我想要在实际默认的Chrome / FF，IE ...弹出警报之前显示它。

我或多或少地处于this situation，但Chrome 51后的答案已经不再相关了。

我做了

(function ($) {
  'use strict';

$(window).bind('beforeunload', function(e) {
  e.preventDefault();
  $('<div title="Attention !">Vous souhaitez quitter cette page. Avez-vous enregistré les données du formulaire ? Si non, choisissez "rester sur la page" lors de l\'affichage de l\'alerte.</div>').dialog({
    modal:true,
    close: function(){$(this).dialog('destroy').remove();},
    position: { my: "center top", at: "center", of: window }
  });
  return "Random message to trigger the browser's native alert.";
});

}(jQuery));

请参阅the fiddle

但是这会在浏览器警报之后显示jQueryUI警报消息，因此它没有用。

在2017年浏览器使用情况下，如何在实际浏览器警报之前显示此jquery警报？谢谢

Answer 1

您可以尝试另一种实现：

<html>
  <head>
    <script type="text/javascript">
      var hook = true;
      window.onbeforeunload = function() {
        if (hook) {
          return "Did you save your stuff?"
        }
      }
      function unhook() {
        hook=false;
      }
    </script>
  </head>
  <body>
    <!-- this will ask for confirmation: -->
    <a href="http://google.com">external link</a>

    <!-- this will go without asking: -->
    <a href="anotherPage.html" onClick="unhook()">internal link, un-hooked</a>
  </body>
</html>

离开具有当前浏览器的页面之前的自定义消息

1 个答案: