表单中多个请求参数名字相同，服务器到底获取的是哪个请求参数的值，表单的action和get和post提交方式的关系以及提交数据的不同点

最新推荐文章于 2021-06-23 20:56:25 发布

程宇寒

最新推荐文章于 2021-06-23 20:56:25 发布

阅读量4.3k

点赞数 1

分类专栏：表单提交数据表单post 表单get 文章标签：表单post 表单get 表单表单提交数据请求参数名字相同

本文链接：https://blog.csdn.net/czh500/article/details/79318224

版权

表单提交数据同时被 3 个专栏收录

1 篇文章 0 订阅

订阅专栏

表单post

1 篇文章 0 订阅

订阅专栏

表单get

1 篇文章 0 订阅

订阅专栏

直接看代码和截图吧，代码中有注释，还有文字说明！

表单get提交和post提交，一个很大的不同点大家都应该知道，post提交，浏览器地址栏中不会明文显示，而get提交，浏览器地址栏中会明文显示，这不是我们今天讨论的重点!

今天讨论的重点如下:

1.表单中如果有2个控件的name属性的值相同，服务器端获取请求参数的时候，获取到的是前面的那个请求参数(不信的话，可以用get方式提交表单，在浏览器地址栏看下这2个名字相同的请求参数哪个在前，服务器端拿到的就是前面的那个请求参数)

2.表单的action中带了请求参数的话，post方式会提交action中的请求参数，get方式不会提交action中的请求参数

3.当表单的action中带的请求参数名称和表单中的控件的name属性的值一样时，如果是post提交表单的话，服务器端获取到的是action中带的请求参数，如果是get提交表单的话，那么服务器端获取到的是表单中的控件(原因参考第2点，表单的action中带了请求参数的话，post会提交action中的请求参数，get不会提交action中的请求参数，所以如果是get提交表单的话，服务器端自然是获取到的是表单中的控件中的值)

testForm.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!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>测试表单的action的get和post方式提交数据的不同，以及测试多个请求参数同名，服务器到底获取的是哪个请求参数的值</title>
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/body.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/mark.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/input2.css">
</head>
<body οnlοad="showFormInfo()">
	<center>
		<h2>
			<font color="red">测试表单的action的get和post方式提交数据的不同，以及测试多个请求参数同名，服务器到底获取的是哪个请求参数的值</font>
		</h2>
		<div style="height: 90px;" class="testDiv3" id="showFormInfo"></div><br>
		<form id="testForm" action="${pageContext.request.contextPath}/TestForm?onlineName=jerry&workCity=beijing&money=19999&money=36888" method="post">
			用户名:<input type="text" name="userName" value="令狐冲">
			<br> 年龄:<input type="text" name="age" value="23">
			<br> 工作城市:<input type="text" name="workCity" value="深圳">
			<br> 老家城市:<input type="text" name="hometown" value="江西省赣州市于都县">
			<br> 薪水:<input type="text" name="money" value="28500">
			<br>
			员工编号2:<input type="text" name="employeeNumber" value="6688"><br>
			员工编号:<input type="text" name="employeeNumber" value="9527"><br>
			<br> <input type="submit" value="submit按钮提交到服务器端"> <input id="postToServerButton"
				type="button" οnclick="postToServer()"> <input id="getToServerButton" type="button" οnclick="getToServer()"><br><br> <input type="reset"
				value="(重置按钮)本质不是清空控件中的值，而是还原控件中的值">
		</form>
	</center>
</body>
<script type="text/javascript">
	
	//显示表单的信息
	function showFormInfo() {
		var formNode = document.getElementById("testForm");
		var message1 = "表单的action=";
		var message2 = "表单的method提交方式=";
		document.getElementById("showFormInfo").innerHTML = message1
				+ formNode.action + "<br>" + message2 + formNode.method;
		var postButton = document.getElementById("postToServerButton");
		postButton.value = "普通按钮" + "post" + "提交至服务器" + formNode.action;
		var getButton = document.getElementById("getToServerButton");
		getButton.value = "普通按钮" + "get" + "提交至服务器" + formNode.action;
	}
	
	/*
		表单post方式提交到服务器端
	*/
	function postToServer(){
		var formNode = document.getElementById("testForm");
		formNode.method = "post";
		formNode.submit();
	}
	
	/*
		表单get方式提交到服务器端
	*/
	function getToServer(){
		var formNode = document.getElementById("testForm");
		formNode.method = "get";
		formNode.submit();
	}
	
</script>
</html>

TestForm.java

package com.jiongmeng.servlet;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * 
 * 测试表单的action的get和post方式提交数据的不同，以及测试多个请求参
 * 数同名，服务器到底获取的是哪个请求参数的值
 * 
 */
@WebServlet("/TestForm")
public class TestForm extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//用户名
		String userName = request.getParameter("userName");
		//网名
		String onlineName = request.getParameter("onlineName");
		//年龄
		String age = request.getParameter("age");
		//工作城市
		String workCity = request.getParameter("workCity");
		//老家城市
		String hometown = request.getParameter("hometown");
		//薪水
		String money = request.getParameter("money");
		//员工编号
		String employeeNumber = request.getParameter("employeeNumber");
		System.out.println("用户名=" + userName + "网名=" + onlineName + "年龄=" + age + "工作城市=" + workCity + "家乡=" + hometown + "薪水=" + money + "员工编号=" + employeeNumber);
		request.getRequestDispatcher("/jsp/form/showFormData.jsp").forward(request, response);
	
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//解决中文乱码的问题(我们这个项目中的web.xml配置了中文乱码的过滤器处理中文乱码的问题)
		//2个注意 (1.只对post有效，所以该行代码放在doGet方法中没有任何意义 2.必须在request.getParameter()前设置，否则还是会乱码，所以为了保险起见，以后就把该行代码放在第一行)
		//request.setCharacterEncoding("utf-8");
		System.out.println("*******************我是TestForm类中的doPost方法*******************");
		doGet(request, response);
	}

}

showFormData.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!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>测试表单的action的get和post方式提交数据的不同，以及测试多个请求参数同名，服务器到底获取的是哪个请求参数的值</title>
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/body.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/mark.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/input2.css">
</head>
<body>
	<center>
		<h2>
			<font color="red">测试表单的action的get和post方式提交数据的不同，以及测试多个请求参数同名，服务器到底获取的是哪个请求参数的值</font>
		</h2>
		<h2>显示从testForm.jsp页面中的表单中提交过来的数据</h2>
		用户名:<font color="red">${param.userName}</font><br>
		网名:<font color="red">${param.onlineName}</font><br>
		年龄:<font color="red">${param.age}</font><br>
		工作城市:<font color="red">${param.workCity}</font><br>
		老家城市:<font color="red">${param.hometown}</font><br>
		薪水:<font color="red">${param.money}</font><br>
		员工编号:<font color="red">${param.employeeNumber}</font><br>
		<br>
		<br>
		<br>
		<div class="testDiv2" style="width: 100%;">
		<h3>
		<font color="blue">
		表单get提交和post提交，一个很大的不同点大家都应该知道，post提交，浏览器地址栏中不会明文显示，而get提交，浏览器地址栏中会明文显示，这不
		是我们今天讨论的重点!
		</font>
		</h3>
		<h3><font color="red">今天讨论的重点如下:</font></h3>
		<font color="#A52A2A">
		1.表单中如果有2个控件的name相同，服务器端获取请求参数的时候，获取到的是前面的那个请求参数(不信的话，可
		以用get方式提交表单，在浏览器地址栏看下这2个名字相同的请求参数哪个在前，服务器端拿到的就是前面的那个请求参数)<br>
		</font>
		2.表单的action中带了请求参数的话，post会提交action中的请求参数，get不会提交action中的请求参数<br>
		<font color="#000000">
		3.当表单的action中带的请求参数名称和表单中的控件的name属性的值一样时，如果是post提交表单的话，服
		务器端获取到的是action中带的请求参数，如果是get提交表单的话，那么服务器端获取到的是表单中的控件(原因参考第2点，表
		单的action中带了请求参数的话，post会提交action中的请求参数，get不会提交action中的请求参数，所以如果是get提
		交表单的话，服务器端自然是获取到的是表单中的控件中的值)<br>
		</font>
		</div>
	</center>
</body>
</html>