html设置弹出提示框
时间: 2024-01-05 09:20:14 浏览: 39
以下是一个使用HTML和JavaScript设置弹出提示框的例子:
```html
<!DOCTYPE html>
<html>
<head>
<title>弹出提示框示例</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
</head>
<body>
<button onclick="showAlert()">点击弹出提示框</button>
<script>
function showAlert() {
swal("提示", "这是一个弹出提示框!", "success");
}
</script>
</body>
</html>
```
在上面的例子中,我们使用了SweetAlert库来创建弹出提示框。首先,我们在`<head>`标签中引入了jQuery和SweetAlert的CSS和JS文件。然后,在`<body>`标签中,我们创建了一个按钮,并在按钮的`onclick`事件中调用了`showAlert()`函数。该函数使用SweetAlert的`swal()`方法来创建一个弹出提示框,其中第一个参数是提示框的标题,第二个参数是提示框的内容,第三个参数是提示框的类型(例如,"success"表示成功提示框)。
请注意,为了使上述代码正常工作,你需要在网络环境下加载jQuery和SweetAlert的CSS和JS文件。你可以将上述代码保存为一个HTML文件,并在浏览器中打开该文件来查看弹出提示框的效果。