Javascript 通知显示为输入文本框使用jquery模式单击

我不知道我是否会很好地解释我的问题，因为我对堆栈溢出一无所知。我已经阅读了T&C，并尽我最大的努力解释了我想要实现的目标。我希望你明白我的要求

我想使用javascript或jQuery创建一个系统，该系统将在浏览器窗口的顶部或底部显示一个弹出框，并在css样式中定义自定义文本和颜色。“通知”会在文本框中告诉用户他们需要做什么，如“写电子邮件”等

以下代码将向您展示我希望它们的外观：

这是第一次显示的默认消息
输入您注册的电子邮件ID
电子邮件ID不正确
电子邮件是正确的-好：显示我5秒后，我会自动隐藏，如果我在绿色，否则显示，直到光标在文本框内。
#通知{
位置：固定；
宽度：100%；
文本对齐：居中；
z指数：99；
溢出：隐藏；
}
#通知h2{
字体大小：16px；
字号：400
}
/*#notification.showNote{
宽度：50%；
左：230像素
}*/
/*错误、信息、通知、警报*/
.success、.warning、.error、.information{显示：块；位置：相对；填充：5px 20px}
.信息{背景颜色：#3bafda}
.success{背景色：#8cc152}
.警告{背景色：#f6bb42}
.错误{背景色：#e9573f}
.通知h2{color:#fff}

一些提示：

id

s在每个页面中都是唯一的。不能仅用一个

id

定义多个元素。相反，您应该使用

class

attribute`

要在几秒钟后执行某些操作，应使用函数

您必须了解jQuery选择器及其一些函数。可在网上阅读

要验证值，您必须知道

您的问题的一个简单工作示例如下。希望能有帮助

让time2Hide=5000；
功能f（选择器）{
$（选择器）.show（）；
设置超时（（）=>{
$（选择器）.hide（）；
}，time2Hide）；
}
f（“警告”）；
功能验证电子邮件（电子邮件）{
变量re=/^（[^（）\[\]\\，；：\s@“]+（\.[^（）\[\]\，；：\s@“]+）*）（“+”）（\[[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[1,3}.[0-9]{1,3}.]124；（[a-zA Z-0-9]+]；
返回re.test（字符串（email.toLowerCase（））；
}
函数onSubmit（）{
let email=$（“#email”）.text（）
如果（！电子邮件）{
f（“信息”）
}
否则如果（验证邮件（电子邮件））{
f（“成功”）；
}
否则{
f（“错误”）
}
}

/**********************************************/
/*通知样式*/
.通知{
位置：固定；
宽度：100%；
文本对齐：居中；
z指数：99；
溢出：隐藏；
}
.通知h2{
字体大小：16px；
字号：400
}
/*#notification.showNote{
宽度：50%；
左：230像素
}*/
/*错误、信息、通知、警报*/
#成功,，
#警告,，
#错误，
#信息{
显示：无；
位置：相对位置；
填充：5px20px
}
#信息{
背景色：#3bafda
}
#成功{
背景色：#8cc152
}
#警告{
背景色：#f6bb42
}
#错误{
背景色：#e9573f
}
.通知h2{
颜色：#fff
}

这是第一次显示的默认消息
输入您注册的电子邮件ID
电子邮件ID不正确
电子邮件是正确的-好：显示我5秒后，我会自动隐藏，如果我在绿色，否则显示，直到光标在文本框内。

您尝试的javascript或jquery代码在哪里？是否检查了更新？如果您输入正确的电子邮件并将注意力集中在外（单击输入中的某个位置），则会验证电子邮件并显示消息！何时显示默认消息@SharadjoshpCheck now@SharadjoshpJust代码与电子邮件类似。有什么问题吗？试着自己写这部分，并对代码提出质疑@Sharadjoshp哪个黄色图像？再次检查@sharadjoshpt这是另一个问题，我看到你问了！你可以接受这个答案，如果它是真的，如果我知道的话。“我会在另一个问题上帮助你们。”沙拉乔什说