使用 jQuery 创建警报
本教程将重点介绍创建或添加 jQuery 警报。快速的答案是使用 jQuery alert() 并提供要在监视中显示的内容作为参数。
使用 jQuery 创建警报
jQuery 提供了几种方便的方法，可用于在应用程序中执行各种任务。向消费者显示通知的最出色方法之一是通过 jQuery 警报消息。
在开发任何代码时，你必须在按下按钮或发生事件时使用警报消息。
语法：
Alert(Specify Content)
用户必须在 content 参数中指定他们希望在警报消息框中显示的任何文本内容。
例子：
<script>
$(document).ready(function () {
$("#alert-id").click(function () {
alert("Hello World! Welcome to upwork.");
});
});
</script>
输出：
当你单击按钮时，它会触发 click() 函数并提供显示一些消息的弹出窗口。
尽管 jQuery 不包含用于创建模态警报的内置 alert 组件，但你可以使用插件在你的网页中构建一个令人惊叹的 jQuery 警报框。
我们将演示如何使用插件来创建各种警报，例如带有简单消息的主警报、确定按钮以及提示和确认警报。继续阅读以查看包含 HTML 组件（如链接）的信号示例。
使用 jAlert 插件创建警报
你可以使用 jAlert 插件为各种警报类型创建具有各种参数的警报，例如，带有关闭警告和使用多个彩色按钮的动画的主要或确认警报。
该插件还与最新的 jQuery 版本兼容。你可以从这里下载最新版本的 jAlert 插件。
在这个示例中创建了一个基本的 jQuery 警报，包括一个用于关闭警报窗口的 Good 按钮。
这是示例代码。你可以保存文件并在浏览器中运行它。
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="jAlert.js"></script>
<link rel="stylesheet" href="jAlert.css" />
</head>
<body>
<h1>jQuery Alert</h1>
<div>
<button class="alertid">Simple jAlert</button>
</div>
<script>
$(".alertid").on("click", function (e) {
e.preventDefault();
var btn = $(this),
theme = "green";
$.jAlert({
title: "jAlert simple sample",
content: "Simple jAlert based on jQuery!",
theme: theme,
closeOnClick: true,
backgroundColor: "white",
btns: [{ text: "Good", theme: theme }],
});
});
</script>
</body>
</html>
theme 变量用于更改警报的颜色。你可以在不同的情况下使用不同的颜色。
类似地，用户可以使用 title 参数来设置警报框的标题。你可以编写要在 content 参数中显示的消息。
对于这个演示，我们使用了白色背景。但你也可以使用黑色。
设置 jAlert 插件
足够的互联网示范；以下是如何在你的 Web 项目中使用这个出色的插件。简而言之，你应该在 <head> 部分中包含插件库：
首先是 jQuery 库，然后是 jAlert 版本 4 的 JS 文件，最后是 CSS 文件。
Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.
LinkedIn