1、制作静态网页，用于个人信息的提交前验证。

最新推荐文章于 2023-05-09 19:40:42 发布

写代码好难

最新推荐文章于 2023-05-09 19:40:42 发布

阅读量1.2k

点赞数

分类专栏： javaweb 文章标签： HTML 表单验证前端开发 JavaScript 个人信息提交

本文链接：https://blog.csdn.net/qq_45691937/article/details/118150422

版权

javaweb 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1、制作静态网页，用于个人信息的提交前验证。

内容要求：
1、编写一个静态页面，用于填写个人的基本信息，包含姓名、性别、年龄、民族、身份证号、家庭住址、上传1张个人照片（可用其他图片代替），页面下方有一个名为“验证”的按钮。
2、点击“验证”按钮后，对填写信息进行验证，包括：姓名不能为空，年龄不能超过200，身份证号只能15倍或者18位。如果信息都正确，弹出提示框：验证成功；如果有不合法的信息，则弹出提示框，显示错误的信息，如：身份证号不合法。
3、效果截图至少包括：整个页面未点击“验证”按钮时的完整截图；验证成功的截图（页面+成功的提示框）；验证失败包含具体错误提示的截图（页面+具体错误消息的提示框）。

 <%@ page language="java" import="java.util.*"  contentType="text/html; charset=gb2312"
    pageEncoding="gb2312"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="gb2312">
<title>信息验证界面</title>
</head>
<body>
<script type="text/javascript">
	function validate(){
		var num = login.id.value;
		//alert(num.toString().length);
		
		if(login.name.value==""){
			alert("姓名为空")
			return;
		}
		if (login.age.value>=200){
			alert("年龄不能超过200")
			return;
		}
		if (num.toString().length!=18 && num.toString().length!=15){
			alert("身份证号不合法")
			return;
		}
		else {
			alert("验证成功")
			login.submit();
		}
	}


</script>
<form  name="login"action="NewFile3.jsp" method="post">
<table border="1" align="center" width="55%" cellpadding="1" cellspacing="0">
  <caption>请输入个人信息</caption>
  <tr>
  		<td class="btbg"><b>姓名</td>
  		<td class="btbg"><input type="text" name="name" style="width:200px;height:50px;"></td>
  		<td class="btbg"><b>性别</td>
  		<td class="btbg"><input type="text" name="sex" style="width:200px;height:50px;"></td>
  		<td colspan="" class="btbg" width="15%" rowspan="2"><b>选择上传照片文件<input type="file" name="photo" style="width:200px;height:50px;"></td>
  	</tr>
  	<tr>
  		<td class="btbg"><b>民族</td>
  		<td class="btbg"><input type="text" name="nation" style="width:200px;height:50px;"></td>
  		<td class="btbg"><b>年龄</td>
  		<td class="btbg"><input type="text" name="age" style="width:200px;height:50px;"></td>
  	</tr>
  	<tr>
  		<td width="8%" class="btbg" colspan="1"><b>身份证号</td>
  		<td colspan="4" width="8%" class="btbg"><input type="text" name="id" style="width:700px;height:100px;"></td>
  	</tr>
  	<tr>
  		<td class="btbg" rowspan="2"><b>家庭住址</td>
  		<td colspan="4" width="8%" class="btbg"><input type="text" name="address" style="width:700px;height:100px;"></td>
  	</tr>
</table>

	<input type="button" value="验证" onClick="validate()">
	</form>
</body>
</html>

页面二，用于验证提交的信息

<%@ page language="java" import="java.util.*" contentType="text/html; charset=gb2312"
    pageEncoding="gb2312"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>您已经登录</title>
</head>
<body>
<h1>  用户验证成功</h1>
	<%
	request.setCharacterEncoding("gb2312");
	String name=request.getParameter("name");
	out.println("用户名"+name+"</br>");
	String sex=request.getParameter("sex");
	out.println("用户性别"+sex+"</br>");
	String age=request.getParameter("age");
	out.println("用户年龄"+age+"</br>");
	String nation=request.getParameter("nation");
	out.println("民族"+nation+"</br>");
	String id=request.getParameter("id");
	out.println("身份证号"+id+"</br>");
	String address=request.getParameter("address");
	out.println("地址"+address+"</br>");
		%>

</body>
</html>

写代码好难

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
1、制作静态网页，用于个人信息的提交前验证。

1、制作静态网页，用于个人信息的提交前验证。内容要求：1、编写一个静态页面，用于填写个人的基本信息，包含姓名、性别、年龄、民族、身份证号、家庭住址、上传1张个人照片（可用其他图片代替），页面下方有一个名为“验证”的按钮。2、点击“验证”按钮后，对填写信息进行验证，包括：姓名不能为空，年龄不能超过200，身份证号只能15倍或者18位。如果信息都正确，弹出提示框：验证成功；如果有不合法的信息，则弹出提示框，显示错误的信息，如：身份证号不合法。3、效果截图至少包括：整个页面未点击“验证”按钮时的完整
复制链接

扫一扫

专栏目录