如何自定义Javascript confirm（）框

Question

stackoverflow如何自定义confirm()框的按钮并向按钮添加自定义文本？

我看到的所有其他问题都指向一个随机jQuery插件来执行此操作。这可以用Vanilla Javascript完成吗？如果是，那怎么办？

Answer 1

您可以为用户提供特定的消息/按钮，而无需使用自定义提醒框/插件。他们是：

1. 要显示仅带有 OK 按钮的消息，请致电：

   window.alert('Message');
   

2. 通过调用

   以确定 / 取消作为选项显示消息

   var didTheyPressOK = window.confirm('Are you sure you want to XXXXX?');
   

3. 正如您的示例中的StackOverflow ，在离开时显示离开... / 保持... 消息页面，按保持会导致浏览器停留在您的页面上（确切的按钮措辞取决于浏览器，您无法控制它）：

   window.onbeforeunload = function() {
       // you may or may not want a condition here, e.g.
       // if (thereAreUnsavedChanges)
       return 'Are you sure you actually want to leave? You have unsaved changes...';
   }
   

对于任何其他情况，您需要使用某种警报插件（或自己写一个： - /），正如您在问题中推测的那样。

---

简单地说，这些按钮是特定于浏览器的，Chrome会自动在按钮上显示有用的文字，以使事情更加清晰。如果您返回一个字符串，它会在window.onbeforeunload内发生，该字符串在导航之前显示为消息。