分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

web前端表单验证

发布时间:2023-09-06 01:13责任编辑:林大明关键词:前端
<form id="registerForm" action="" ?method="post"onsubmit="return checkForm();">  用户名:  <input type="text" id="username" name="username" maxlength="20" onblur="checkUsername()"/><span id="span1"></span>  密码:   <input type="password" id="password" name="password" maxlength="20"/>  确认密码: <input id="repassword" type="password" name="repassword" maxlength="20"/>        <input type="submit" value="注册"></form>
function checkForm(){  // 校验用户名:  // 获得用户名文本框的值:  var username = document.getElementById("username").value;  if(username == null || username == ‘‘){    alert("用户名不能为空!");    return false;  }  // 校验密码:  // 获得密码框的值:  var password = document.getElementById("password").value;  if(password == null || password == ‘‘){    alert("密码不能为空!");    return false;  }  // 校验确认密码:  var repassword = document.getElementById("repassword").value;  if(repassword != password){    alert("两次密码输入不一致!");    return false;  }} function checkUsername(){  // 获得文件框值:  var username = document.getElementById("username").value;  // 1.创建异步交互对象  var xhr = createXmlHttp();  // 2.设置监听  xhr.onreadystatechange = function(){    if(xhr.readyState == 4){      if(xhr.status == 200){        document.getElementById("span1").innerHTML = xhr.responseText;      }    }  }  // 3.打开连接  xhr.open("GET","${pageContext.request.contextPath}/user_findByName.action?time="+new Date().getTime()+"&username="+username,true);  // 4.发送  xhr.send(null);} function createXmlHttp(){  var xmlHttp;  try{ // Firefox, Opera 8.0+, Safari    xmlHttp=new XMLHttpRequest();  }catch (e){    try{// Internet Explorer      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");    }catch (e){      try{        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");      }catch (e){} ??????} ??}  return xmlHttp;}


public String findByName() throws IOException {  // 调用Service进行查询:  User existUser = userService.findByUsername(user.getUsername());  // 获得response对象,项页面输出:  HttpServletResponse response = ServletActionContext.getResponse();  response.setContentType("text/html;charset=UTF-8");  // 判断  if (existUser != null) {    // 查询到该用户:用户名已经存在    response.getWriter().println("<font color=‘red‘>用户名已经存在</font>");  } else {    // 没查询到该用户:用户名可以使用    response.getWriter().println("<font color=‘green‘>用户名可以使用</font>");  }  return NONE;}
 
 

web前端表单验证

原文地址:http://www.cnblogs.com/gerry/p/7592715.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved