首页 前端知识 JavaScript--弹窗

JavaScript--弹窗

2024-03-18 11:03:42 前端知识 前端哥 108 41 我要收藏

简介

JavaScript提供了几种常用的弹窗方法,用于与用户进行交互或显示提示消息。以下是三种常见的JavaScript弹窗方法:

  1. 警告框(Alert): 使用alert()方法创建一个警告框,它会显示一条消息并包含一个"确定"按钮。
  2. 确认框(Confirm): 使用confirm()方法创建一个确认框,它会显示一条消息并包含一个"确定"按钮和一个"取消"按钮。用户可以点击其中一个按钮来进行选择,并返回对应的布尔值结果(true表示点击了"确定"按钮,false表示点击了"取消"按钮)。
  3. 提示框(Prompt): 使用prompt()方法创建一个提示框,它会显示一条消息,并包含一个文本输入框、一个"确定"按钮和一个"取消"按钮。用户可以在输入框中输入文本内容,并点击相应按钮来确认或取消操作。prompt()方法将返回用户在输入框中输入的文本内容。 

示例 

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript弹窗示例</title>
</head>
<body>
  <h1>JavaScript弹窗示例</h1>

  <!-- 警告框 -->
  <button onclick="showAlert()">显示警告框</button>

  <!-- 确认框 -->
  <button onclick="showConfirm()">显示确认框</button>

  <!-- 提示框 -->
  <button onclick="showPrompt()">显示提示框</button>

  <script>
    // 显示警告框
    function showAlert() {
      alert("这是一个警告框!");
    }

    // 显示确认框
    function showConfirm() {
      var result = confirm("是否继续操作?");
      if (result) {
        alert("您点击了确定按钮!");
      } else {
        alert("您点击了取消按钮!");
      }
    }

    // 显示提示框
    function showPrompt() {
      var name = prompt("请输入您的姓名:");
      if (name) {
        alert("您输入的姓名为:" + name);
      } else {
        alert("您点击了取消按钮或未输入内容!");
      }
    }
  </script>
</body>
</html>
转载请注明出处或者链接地址:https://www.qianduange.cn//article/3922.html
标签
评论
发布的文章

jQuery事件绑定

2024-04-13 09:04:31

Jquery——基础

2024-04-03 12:04:28

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!