注册交单的校验

2023-10-29 13:50
文章标签 校验 注册 交单

本文主要是介绍注册交单的校验,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
 <!--需求:表单校验
 思路:1 写好表单框架
     2 用js分别写好每个表单功能的校验的方法,
  3 把所有的方法封装到一起
  -->
 
 <script type="text/javascript">
  //性提高代码的复用
  function check(name,id,regex,truecode,falsecode){
   var flag=false;
   var val =document.getElementsByName(name)[0].value;
   var spannode=document.getElementById(id);
   if(regex.test(val)){
    spannode.innerHTML=truecode.fontcolor("green");
    flag=true;
   }else{
    spannode.innerHTML=falsecode.fontcolor("red");
   }
   return flag;
  }
  //校验用户名
  function checkuser(){
   var useregex =new RegExp("^[a-zA-Z]{4}$");
   return check("usename","userspan",useregex,"用户名正确","用户名错误");
  }
  //校验密码
  function checkpsw(){
   var pswregex=new RegExp("^[0-9]{4}$");
   return check("psw","pswspan",pswregex,"密码正确","密码错误");
  }
  //校验确认密码
  function checkpsw2(){
   var psw2flag=false;
   var psw2name=document.getElementsByName("psw2")[0];
   var pswname=document.getElementsByName("psw")[0];
   var psw2val=psw2name.value;
   var pswval=pswname.value;
   var psw2spannode=document.getElementById("psw2span");
   if(psw2val==pswval){
    psw2spannode.innerHTML="确认密码正确".fontcolor("green");
    psw2flag=true;
   }else{
    psw2spannode.innerHTML="确认密码错误".fontcolor("red");
   }
   return psw2flag;
  }
  //校验性别
  function checksex(){
   var sexflag=false;
   var sexnode=document.getElementsByName("sex");
   for(var x=0;x<sexnode.length;x++){
    if(sexnode[x].checked){
     sexflag=true;
     break;
    }
   }
   if(!sexflag){
    var sexspannode=document.getElementById("sexspan");
    sexspannode.innerHTML="请选择性别".fontcolor("red");
   }
   return sexflag;
  }
  //校验下拉菜单
  function checkselect(){
   var selectflag=false;
   var menunode =document.getElementsByName("country")[0];
   var menu_options=menunode.options;
   var menuspannode=document.getElementById("menuspan");
   if(menu_options[menunode.selectedIndex].value=="none"){
    menuspannode.innerHTML="请选择国家".fontcolor("red");
   }else{
    selectflag=true;
   }
   return selectflag;
  }
  //校验表单
  function checkform(){
   if(checkuser()&&checkpsw()&&checkpsw2()&&checksex()&&checkselect()){
    return true;
   }else{
    return false;
   }
  }
 </script>
 
 <form id="formid" οnsubmit="return checkform()">
  用户名称:<input type="text" name="usename" οnblur="checkuser()"/><span id="userspan"></span><br/>
  输入密码:<input type="password" name="psw" οnblur="checkpsw()"/><span id="pswspan"></span><br/>
  确认密码:<input type="password" name="psw2" οnblur="checkpsw2()"/><span id="psw2span"></span><br/>
  选择性别:<input type="radio" name="sex" value="nan"/>男 <input type="radio" name="sex" value="nv"/>女<span id="sexspan"></span><br/>
  选择国家:<select name="country" οnchange="checkselect()">
   <option value="none">选择国家</option>
   <option value="cn">中国</option>
   <option value="en">英国</option>
  </select><span id="menuspan"></span><br/>
  <input type="submit" value="提交"/><input type="reset" value="重置"/>
  <!-- <input type="button" value="提交按钮" οnclick="checkform()"/> -->
 </form>
</body>
</html>

转载于:https://my.oschina.net/u/1589656/blog/263587

这篇关于注册交单的校验的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/301070

相关文章

SpringBoot 异常处理/自定义格式校验的问题实例详解

《SpringBoot异常处理/自定义格式校验的问题实例详解》文章探讨SpringBoot中自定义注解校验问题,区分参数级与类级约束触发的异常类型,建议通过@RestControllerAdvice... 目录1. 问题简要描述2. 异常触发1) 参数级别约束2) 类级别约束3. 异常处理1) 字段级别约束

SpringBoot整合Dubbo+ZK注册失败的坑及解决

《SpringBoot整合Dubbo+ZK注册失败的坑及解决》使用Dubbo框架时,需在公共pom添加依赖,启动类加@EnableDubbo,实现类用@DubboService替代@Service,配... 目录1.先看下公共的pom(maven创建的pom工程)2.启动类上加@EnableDubbo3.实

SpringBoot中如何使用Assert进行断言校验

《SpringBoot中如何使用Assert进行断言校验》Java提供了内置的assert机制,而Spring框架也提供了更强大的Assert工具类来帮助开发者进行参数校验和状态检查,下... 目录前言一、Java 原生assert简介1.1 使用方式1.2 示例代码1.3 优缺点分析二、Spring Fr

一文详解SpringBoot中控制器的动态注册与卸载

《一文详解SpringBoot中控制器的动态注册与卸载》在项目开发中,通过动态注册和卸载控制器功能,可以根据业务场景和项目需要实现功能的动态增加、删除,提高系统的灵活性和可扩展性,下面我们就来看看Sp... 目录项目结构1. 创建 Spring Boot 启动类2. 创建一个测试控制器3. 创建动态控制器注

浏览器插件cursor实现自动注册、续杯的详细过程

《浏览器插件cursor实现自动注册、续杯的详细过程》Cursor简易注册助手脚本通过自动化邮箱填写和验证码获取流程,大大简化了Cursor的注册过程,它不仅提高了注册效率,还通过友好的用户界面和详细... 目录前言功能概述使用方法安装脚本使用流程邮箱输入页面验证码页面实战演示技术实现核心功能实现1. 随机

Nacos注册中心和配置中心的底层原理全面解读

《Nacos注册中心和配置中心的底层原理全面解读》:本文主要介绍Nacos注册中心和配置中心的底层原理的全面解读,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录临时实例和永久实例为什么 Nacos 要将服务实例分为临时实例和永久实例?1.x 版本和2.x版本的区别

Python FastAPI实现JWT校验的完整指南

《PythonFastAPI实现JWT校验的完整指南》在现代Web开发中,构建安全的API接口是开发者必须面对的核心挑战之一,本文将深入探讨如何基于FastAPI实现JWT(JSONWebToken... 目录一、JWT认证的核心原理二、项目初始化与环境配置三、安全密码处理机制四、JWT令牌的生成与验证五、

Spring Validation中9个数据校验工具使用指南

《SpringValidation中9个数据校验工具使用指南》SpringValidation作为Spring生态系统的重要组成部分,提供了一套强大而灵活的数据校验机制,本文给大家介绍了Spring... 目录1. Bean Validation基础注解常用注解示例在控制器中应用2. 自定义约束验证器定义自

SpringBoot3.4配置校验新特性的用法详解

《SpringBoot3.4配置校验新特性的用法详解》SpringBoot3.4对配置校验支持进行了全面升级,这篇文章为大家详细介绍了一下它们的具体使用,文中的示例代码讲解详细,感兴趣的小伙伴可以参考... 目录基本用法示例定义配置类配置 application.yml注入使用嵌套对象与集合元素深度校验开发

Java使用ANTLR4对Lua脚本语法校验详解

《Java使用ANTLR4对Lua脚本语法校验详解》ANTLR是一个强大的解析器生成器,用于读取、处理、执行或翻译结构化文本或二进制文件,下面就跟随小编一起看看Java如何使用ANTLR4对Lua脚本... 目录什么是ANTLR?第一个例子ANTLR4 的工作流程Lua脚本语法校验准备一个Lua Gramm