javascript jsp登陆界面
2016-01-21 15:39
513 查看
学习了点javascript 迫不及待的写了一个登陆界面,实现了一些基本功能,如不能为空,密码必须为数字和字母且输入的字符长度有限制,东西很简单,但也算是一个小进步吧,同时也希望对和我一样的初学者有点帮助。
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> <script type="text/javascript"> function login(){ var username = document.getElementById("username"); var password = document.getElementById("psd"); //正则表达式 只允许输入数字和密码 var repPass = new RegExp("^[A-Za-z0-9]+$"); //不允许用户名为空 if(username.value==""){ alert("用户名不能为空"); psd.value = null; username.focus(); return; } //不允许密码为空 if(password.value==""){ password.focus(); alert("密码不为空"); return; } //密码框只允许输入数字和密码 if(!repPass.test(password.value)){ password.value=null; password.focus(); alert("只允许输入数字和字母"); return; } //密码输入长度为5到15个字符 if(password.value.length>15||password.value.length<5){ password.value = null; password.focus(); alert("输入长度为5到15个字符"); return; } document.getElementById("info").submit(); } </script> </head> <body> <form id="info" action="XX" method="get"> <table align="center" width="768" border="2"> <tr> <td>用户名:</td> <td><input id="username" type="text" name="username"/></td> </tr> <tr> <td>密码:</td> <td><input id="psd" type="password" name="psd"/></td> </tr> <tr> <td></td> <td><input type="button" value="提交" onclick="login()"/></td> </tr> </table> </form> </body> </html>
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- JavaScript演示排序算法
- JSP/PHP基于Ajax的分页功能实现
- javascript实现10进制转为N进制数
- 开发阶段Jetty运行Jsp报错且响应空白
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 异步流程控制:7 行代码学会 co 模块
- ES6 走马观花(ECMAScript2015 新特性)
- JavaScript拆分字符串时产生空字符的原因
- Canvas 在高清屏下绘制图片变模糊的解决方法
- Redux系列02:一个炒鸡简单的react+redux例子