1、效果展示


2、问题描述

当用户在输入框输入邮箱后、点击验证邮箱按钮。系统给出提示信息。

3、代码实现

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8" />

		<title></title>

	</head>

	<body>

		<script type="text/javascript">

			window.onload=function(){

				var check=document.getElementById("btn").onclick=function(){

					var email=document.getElementById("email").value;//获取输入的字符串

					var emailRegExp=/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;//验证邮箱的正则表达式

					var ok=emailRegExp.test(email);//验证是否符合要求

					if(ok){

						document.getElementById("erroremail").innerText="输入的格式符合要求";

					}else{

						document.getElementById("erroremail").innerText="输入的格式不符合要求！！！";

					}

				}

				document.getElementById("email").onfocus=function(){

					document.getElementById("erroremail").innerText="";

				}

			}

		</script>

		<input type="text" id="email" />

		<span id="erroremail" style=" font: 12px; color: red;"></span>

		<br />

		<input type="button" value="验证邮箱" id="btn" />

	</body>

</html>

js中通过正则表达式验证邮箱是否合法的更多相关文章

  1. Android中利用正则表达式验证手机号是否合法

    利用正则表达式来验证手机号是否合法,现在我们简单使用一下,这个在实际的应用中很实用. 例:在输入框中输入手机号,判断是否合法, MainActivity中: package com.example.m ...

  2. js如何使用正则表达式验证电话号码（可选区号）和邮箱？（分步骤）

    js如何使用正则表达式验证电话号码(可选区号)和邮箱?(分步骤) 一.总结 js进阶正则表达式16电话号码和邮箱正则(分类解决邮箱验证)(分组加?解决电话号码区号选择问题)([\w\.-]中括号解决邮 ...

  3. web开发常用的js验证,利用正则表达式验证邮箱、手机、身份证等输入

    正则表达式验证 //邮箱 \-])+\.)+([a-zA-Z0-]{,})+$/; email = document.getElementById("email").value; ...

  4. favicon.ico应用与正则表达式验证邮箱（可自动删除前后的空格）

    1.favicon.ico制作:favicon.ico可以ps制作;“shortcut icon”中间有一个空格 <head> <link rel="shortcut ic ...

  5. JavaScript -- 时光流逝（六）：js中的正则表达式 -- RegExp 对象

    JavaScript -- 知识点回顾篇(六):js中的正则表达式 -- RegExp 对象 1. js正则表达式匹配字符之含义      查找以八进制数 规定的字符.     查找以十六进制数 规定 ...

  6. JS中应用正则表达式转换大小写

    JS中应用正则表达式转换大小写,代码很简单,看代码: 以下首字母大写,其它字母小写 <script type="text/javascript"> function r ...

  7. 如何在JS中应用正则表达式

    背景:在之前的随笔中写过C#中如何使用正则表达式,这篇随笔主要讲如何在js中应用正则表达式 如下代码: $("#zhengze").click(function () { var ...

  8. 面试题 正则表达式 验证邮箱 Pattern.matches

    故事背景 今天面试遇到这道题,对正则表达式还是有些懵,面试完回家复盘实现一下.这里使用到了 Pattern 这个类来校验正则表达式. 正则表示式分析: ^([a-z0-9A-Z]+[-|\\.]?)+ ...

  9. vue中将验证表单输入框的方法写在一个js文件中（表达式验证邮箱、身份证、号码、两次输入的密码是否一致）

    文章目录 1.实现的效果 2.编写的js文件(这里写在了api文件下) 3.在vue页面中引入(script) 4.页面代码 1.实现的效果 20220606_154646 2.编写的js文件(这里写 ...

随机推荐

  1. 记一次 ClickHouse 性能测试

    前言 在工作场景中,我们会采集工厂设备数据用于智能控制,数据的存储用了 InfluxDB,随着数据规模越来越大,InfluxDB 的性能越来越差,故考虑引入 ClickHouse 分担 InfluxD ...

  2. Vue3 发生错误：setup function returned a promise

    当你组件中有 Promise 对象时,即 Axios.Ajax 这类的请求,然后把数据渲染到模板中就会报如下图的错误: 在这个异步组件外包裹一个 <Suspense> 组件.比如 App. ...

  3. 简单html js css 轮播图片，不用jquery

    这个是自己修改的轮播图片,在网上有的是flash 实现的轮播图片,对搜索引擎不友好, 比如:dedecms 的首页的轮播图是用flash实现滚动的. 所以这个自己修改了一下,实现html+js+css ...

  4. Filter中的FilterChain.doFilter(req,resp)的报错解决

    服务器内部错误:500 Request processing failed; nested exception is java.lang.IllegalStateException: 提交响应后无法调 ...

  5. 创建swarm集群并自动编排

    1.基础环境配置 主机名 master node1 node2 IP地址 192.168.***.1 192.168.***.2 192.168.***.3 角色     管理节点 工作节点 工作节点 ...

  6. 细数实现全景图VR的几种方式（panorama/cubemap/eac）

    Three.js系列: 在元宇宙看电影,享受 VR 视觉盛宴 Three.js系列: 造个海洋球池来学习物理引擎 Three.js系列: 游戏中的第一.三人称视角 Three.js系列: 数实现全景图 ...

  7. GNSS模块使用笔记

    目录 目录 GNSS芯片 NMEA0183 协议 指令 GNSS TO MCU MCU TO GNSS GNSS芯片 ATGM336H-5N31(GPS+BDS双模) 原理图 NMEA0183 协议 ...

  8. Spring源码学习笔记12——总结篇,IOC，Bean的生命周期，三大扩展点

    Spring源码学习笔记12--总结篇,IOC,Bean的生命周期,三大扩展点 参考了Spring 官网文档 https://docs.spring.io/spring-framework/docs/ ...

  9. 【金九银十必问面试题】站在架构师角度分析问题，如何解决TCC中的悬挂问题

    "如何解决TCC中的悬挂问题"! 一个工作了4年的Java程序员,去京东面试,被问到这个问题. 大家好,我是Mic,一个工作了14年的Java程序员 这个问题面试官想考察什么方面的 ...

  10. 电商平台物流模块自建OR对接第三方物流平台

    ​ 前沿 近几年来,电商行业竞争变得愈加激烈,公域流量获客成本越来越高,电商平台规则也越来越严格,数据无法出塔,商家无法自主运营用户群等等原因,很多大品牌纷纷开始搭建自有商城,运营私域流量,以此来降低 ...