js经典校验之注册与登录校验

最新推荐文章于 2022-11-21 16:04:10 发布
VIP文章 最新推荐文章于 2022-11-21 16:04:10 发布
阅读量1.2k 收藏 5
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/boss2967/article/details/77580213
版权

例子1


用户注册校验


用户注册jsp页面

[html]  view plain  copy
 
  在CODE上查看代码片 派生到我的代码片
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>  
  3.   
  4.   
  5. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  6. <html>  
  7.   <head>  
  8.     <title>注册页面</title>  
  9.       
  10.     <meta http-equiv="pragma" content="no-cache">  
  11.     <meta http-equiv="cache-control" content="no-cache">  
  12.     <meta http-equiv="expires" content="0">      
  13.     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
  14.     <meta http-equiv="description" content="This is my page">  
  15.     <link rel="stylesheet" type="text/css" href="<c:url value='/jsps/css/user/regist.css'/>">  
  16.     <script type="text/javascript" src="<c:url value='/jquery/jquery-1.5.1.js'/>"></script>  
  17.     <script type="text/javascript" src="<c:url value='/jsps/js/user/regist.js'/>"></script>  
  18.   </head>  
  19.     
  20.   <body>  
  21. <div id="divMain">  
  22.   <div id="divTitle">  
  23.     <span id="spanTitle">新用户注册</span>  
  24.   </div>  
  25.   <div id="divBody">  
  26. <form action="<c:url value='/UserServlet'/>" method="post" id="registForm">  
  27.     <input type="hidden" name="method" value="regist"/>    
  28.     <table id="tableForm">  
  29.       <tr>  
  30.         <td class="tdText">用户名：</td>  
  31.         <td class="tdInput">  
  32.           <input class="inputClass" type="text" name="loginname" id="loginname" value="${form.loginname }"/>  
  33.         </td>  
  34.         <td class="tdError">  
  35.           <label class="errorClass" id="loginnameError">${errors.loginname }</label>  
  36.         </td>  
  37.       </tr>  
  38.       <tr>  
  39.         <td class="tdText">登录密码：</td>  
  40.         <td>  
  41.           <input class="inputClass" type="password" name="loginpass" id="loginpass" value="${form.loginpass }"/>  
  42.         </td>  
  43.         <td>  
  44.           <label class="errorClass" id="loginpassError">${errors.loginpass }</label>  
  45.         </td>  
  46.       </tr>  
  47.       <tr>  
  48.         <td class="tdText">确认密码：</td>  
  49.         <td>  
  50.           <input class="inputClass" type="password" name="reloginpass" id="reloginpass" value="${form.reloginpass }"/>  
  51.         </td>  
  52.         <td>  
  53.           <label class="errorClass" id="reloginpassError">${errors.reloginpass}</label>  
  54.         </td>  
  55.       </tr>  
  56.       <tr>  
  57.         <td class="tdText">Email：</td>  
  58.         <td>  
  59.           <input class="inputClass" type="text" name="email" id="email" value="${form.email }"/>  
  60.         </td>  
  61.         <td>  
  62.           <label class="errorClass" id="emailError">${errors.email}</label>  
  63.         </td>  
  64.       </tr>  
  65.       <tr>  
  66.         <td class="tdText">验证码：</td>  
  67.         <td>  
  68.           <input class="inputClass" type="text" name="verifyCode" id="verifyCode" value="${form.verifyCode }"/>  
  69.         </td>  
  70.         <td>  
  71.           <label class="errorClass" id="verifyCodeError">${errors.verifyCode}</label>  
  72.         </td>  
  73.       </tr>  
  74.       <tr>  
  75.         <td></td>  
  76.         <td>  
  77.           <div id="divVerifyCode"><img id="imgVerifyCode" src="<c:url value='/VerifyCodeServlet'/>"/></div>  
  78.         </td>  
  79.         <td>  
  80.           <label><a href="javascript:_hyz()">换一张</a></label>  
  81.         </td>  
  82.       </tr>  
  83.       <tr>  
  84.         <td></td>  
  85.         <td>  
  86.           <input type="image" src="<c:url value='/images/regist1.jpg'/>" id="submitBtn"/>  
  87.         </td>  
  88.         <td>  
  89.           <label></label>  
  90.         </td>  
  91.       </tr>  
  92.     </table>
最低0.47元/天 解锁文章
boss2967
关注
  • 0
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript使用正则表达式实现注册登入校验
10-14
主要为大家详细介绍了javascript使用正则表达式实现注册登入校验，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
JS项目（验证注册页面信息）
A_Xunla的博客
06-02 4532
JS项目（验证注册页面信息） 设计如下图所示的页面，各文本框输入信息在失去焦点时验证，如果输入有误，在文本框后面提示错误信息，各文本框输入信息的具体要求如下： (1) 用户名是由 4 ~ 16 位字符组成，不能包含数字，不能为空。加载页面时提示相应信息。 (2) 密码是由 4 ~ 10 位字符组成，且不能为空，加载页面时提示相应信息。密码和确认密 码必须一致。 (3) 电子邮箱信息不能为空，且必须包含“@”符号和“.”符号，且“@”符号不能在第 1 位，必须在“.”符号前面。.........
JS登录与注册验证
Dorry_x的博客
06-27 2447
类的命名原则 1 必须由大写字母开头而单词中的其他字母均为小写 2 如果类名称由多个单词组成，则每个单词的首字母均应为大写例如TestPage 3 如果类名称中包含单词缩写，则这个所写词的每个字母均应大写，如：XMLExample 4 在命名类时应尽量选择名词 5 $ _ 6 避免关键字 JS登录与注册验证 1 Jsp页面代码     用户登录     用 户
使用JavaScript实现注册页面并验证
weixin_69420643的博客
09-21 5617
使用JavaScript实现注册页面并验证
JavaScript 登录注册表单验证
阿博的博客
07-24 3972
JavaScript 表单验证
js登录验证
qq_44376244的博客
06-09 2988
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do.
js简单实现用户注册信息的校验代码
10-26
介绍了js简单实现用户注册信息的校验代码，有需要的朋友可以参考一下
JavaScript 完成注册页面表单校验的实例
12-10
1、步骤分析 第一步：确定事件(onsubmit)并为其绑定一个函数 第二步：书写这个函数(获取用户输入的数据&...2、完成注册页面表单校验 <!DOCTYPE html> <html> <head> <meta charset="UTF-8">
js正则实现用户登录注册
赵佳敏的博客
10-11 3282
js正则实现用户登录注册一、效果图二、实现思路三、核心代码 一、效果图 二、实现思路 第一步：分别对帐号、密码、验证码进行验证，先判断账号、密码、验证码的值是否存在，不存在则引出对应error信息。 第二步：如果值存在，使用正则判断值是否符合要求，正确输出信息，不正确输出error的信息。 第三步：设置表单失焦出现对应的error信息，获焦移除当前的error。 第四步：表单提交的时候，按钮进行获焦，如果没有错误信息就进行提交，并且清除所有信息。 三、核心代码 &lt.
【JavaScript】案例1：使用JS完成注册页面校验
专注于Java领域开发 关注我 带你玩转Java
07-30 7120
使用JS完成注册页面校验
注册登录验证js
09-10
注册登录js验证代码，javascript学习中关于表单提交和用户输入信息的验证。
Dom-Jquery-Ajax学习笔记
qq_44298719的博客
01-03 211
BOM 概述 BOM:Brower Object Model(浏览器对象模型)；即js中将有关浏览器的操作的顶层元素都是来自window对象；对外界提供了一个用于操作浏览器的访问结构，通过bom可以获取window相关信息，比如屏幕的尺寸，浏览器的详细信息（版本，内核，配置等），页面跳转，历史记录，定位，本地存储等，对于移动设备来说还可以获取与本机设备交互的硬件接口(位置信息，蓝牙，摄像头，陀螺仪) window window对象是BOM的顶层对象，bom中的一些核心对象都是源自于window，全局函数的t
【JS】用JS实现系统登录页的登录和验证
热门推荐
wan小小冰的博客
09-05 6万+
这篇文章用JS显示表单的登录以及验证和对键盘的监听，这里有两种方法，一种是无需用户验证直接登录，一种是需要账户密码匹配才可登录。1. html代码&lt;div class=&quot;content&quot;&gt; &lt;div class=&quot;login-wrap&quot;&gt; &lt;form id=&quot;user_login&quot; action=&amp
原生js实现用户登陆验证
行大于言
12-20 2740
目的：我们要想实现利用正则实现用户登陆验证，正确则跳转到个人主页，错误则提示输入错误 我们会想到用form表单来实现页面的跳转，但使用form表单就无法利用正则来判断输入的数据的正错，无论输入对错，都会跳转到action的页面 所以我们选择利用原生js来实现我们想要的效果 首先我们需要获取输入框的值： 我们还是用到了from表单???? 先给form加个name属性，再给input加个name属性 &l...
登陆切换
EIERICA的博客
12-19 830
js、html实现验证码登录与账号登录之间的切换 在近期的项目中遇到的一些有意思的点分享给大家。 第一个就是关于验证码登录与账号登录之间的切换问题，我是直接去看了美团网的源码，发现实现其实实现的方式很简单。 主要的方法就是定义两个表单。一个是验证码登录的表单A，一个是账号登陆的表单B。A的display值先为none，B为正常的值。再要切换登陆方式的时候，使用js将B的display值...
Vue如何实现不同登录方式的切换（账号密码登录、邮箱验证登录等）
Wzmlzrr的博客
03-26 1万+
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录前言一、使用vue开发框架的时候，无论是vue2或是vue3，都会运用到element ui组件库或是element-plus ui组件库，所以我们要解决的问题首先从这些组件库里来找寻答案二、项目里按需引入或者全局导入element ui组件库或是element-plus ui组件库1.省略常规操作，直接在页面中引入Tabs（标签页）组件2.运行后的效果三、再说一下Tabs（标签页）的属性（根据项目的实际需求添加） 前言 通常情.
用js实现页面登录重用(一个页面实现两种类型的登录)
huacai2010的专栏
03-11 1441
test function changeRadio(){ var myradio=document.getElementsByName("myRadio");  var div = document.getElementById("myDiv").getElementsByTagName("div"); for(i=0;i if(myradio[i].checked){ div[i
登陆切换：将账号登陆切换为邮箱登录
weixin_54327001的博客
11-21 195
反之，如果想要输入内容保存下来，可以不写key值或者key值相等。当切换登陆类型时，上次输入的内容没有清空，而是保存了下来。
写一个js登录页面包括校验
最新发布
07-11
好的，我可以为您提供一个简单的 JS 登录页面示例，包括基本的校验功能。 HTML 代码： ``` <!DOCTYPE html> 登录页面 登录 用户名： 密码： ()">登录 <script src="login.js"> ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值