保存确认框

保存确认框常用于用户需要进行某种操作时，系统需要确认用户是否愿意执行该操作。在前端开发中，我们常用 JavaScript 来实现确认框的功能。下面将介绍如何使用 JavaScript 创建和调用确认框，并提供一些使用例子。

首先，我们需要创建一个包含确认框逻辑的 JavaScript 函数。可以使用 window.confirm() 方法来创建确认框。该方法会在页面上显示一个模态框，显示一条消息和两个按钮：确定和取消。具体代码如下：

function showConfirmation(message) {
  var result = window.confirm(message);
  if (result) {
    // 用户点击了确定按钮
    // 在这里执行相应的操作
  } else {
    // 用户点击了取消按钮
    // 在这里执行相应的操作
  }
}

在上面的代码中，message 参数为要显示给用户的消息。当用户点击确定按钮时，window.confirm() 方法会返回 true，否则返回 false。我们可以根据返回结果执行相应操作。

下面是一些使用例子：

### 例子一：删除确认

function deleteItem(itemId) {
  var message = "确定要删除该项吗？";
  showConfirmation(message, function() {
    // 用户点击了确定按钮，执行删除操作
    // 根据 itemId 执行相应的删除逻辑
  });
}

在上面的例子中，用户点击删除按钮时会调用 deleteItem() 函数，该函数会显示一个删除确认框，当用户点击确定按钮时，会执行相应的删除操作。

### 例子二：提交表单前确认

function submitForm() {
  var message = "确定要提交表单吗？";
  showConfirmation(message, function() {
    // 用户点击了确定按钮，执行表单提交操作
    // 获取表单数据，进行提交
  });
}

在上面的例子中，用户点击提交按钮时会调用 submitForm() 函数，该函数会显示一个确认框，当用户点击确定按钮时，会执行表单提交操作。

### 例子三：离开页面前确认

window.onbeforeunload = function(event) {
  var message = "确定要离开该页面吗？";
  showConfirmation(message, function() {
    // 用户点击了确定按钮，继续离开页面
  });
  // 返回确认消息
  return message;
}

在上面的例子中，当用户尝试离开当前页面时，会显示一个确认框，用来确认用户是否要离开页面。当用户点击确定按钮时，会继续离开页面。

上述例子都是通过调用 showConfirmation() 函数来显示确认框。需要注意的是，确认框是一个模态框，会阻止用户继续进行其他操作，直到用户点击确定或取消按钮。因此，在使用确认框时需要避免滥用，以免影响用户体验。

通过上面的介绍，我们可以看到如何使用 JavaScript 创建和调用确认框，并给出了一些使用例子。开发者可以根据实际需求和场景，选择适合自己的确认框使用方式。