一个js 数组怎么传到后台

JavaScript017

一个js 数组怎么传到后台,第1张

<!DOCTYPE html>  

<html>

<head>

<title>XHR数据发送到后台</title>

</head>  

<body>

<form action="index.php" method="post" onsubmit="return test()">

姓名:<input type="text" name="username"/><br />

年龄:<input type="text" name="age"/><br />

身高:<input type="text" name="sengao"/><br />

<input type="submit" />

</form>

<!--

后台$_POST后,会得到一个一维数组,数组单元就是由form表单数据组成的。

-->

<div></div>

<script type="text/javascript">

function test(){

//获取dom节点

var fm = document.getElementsByTagName('form')[0]

//利用HTML5 FormData对象获取表单数据

//并把DOM表单对象作为参数传给FormData

var fD = new FormData(fm)

//可以追加数据

fD.append('xuexing','A')

//创建XML请求

var xhr = new XMLHttpRequest()

//打开链接,异步请求

xhr.open('POST','index.php',true)

//发送表单数据

xhr.send(fD)

//事件响应

xhr.onreadystatechange = function (){

//接受到后台返回数据时,写入到div文本节点内

if(this.readyState == 4){

document.getElementsByTagName('div')[0].innerHTML = this.responseText

}

}

return false

}

</script>

</body>  

</html>

1、前台jsp中数组变量:var checkedData = []//前台变量12、在ajax中设置该属性:traditional: true,//传数组进后台需要设置该属性1Ajax代码示例:$.ajax({url : URL_Business_QFCJPage,data : {"checkedData" : checkedData },dataType : 'json',type : "post",traditional: true,//属性在这里设置success : function(message) { //回调函数代码省略},waitMsg : '正在处理数据....'})123456789101112133、后台Servlet中这样获取:String[] s = request.getParameterValues("checkedData")//获取数组使用该函数1Servlet代码示例:package com.***@Controllerpublic class QFCJPageController {@RequestMapping("/business/QFCJPage")@ResponseBodypublic void CJ(HttpServletRequest request, HttpServletResponse response) throws IOException {//如果数组有中文,注意设置编码,防止接收数据乱码。request.setCharacterEncoding("utf-8") response.setCharacterEncoding("utf-8") String[] s = request.getParameterValues("checkedData")//"s"为获取的前台数组}}

<!DOCTYPE html>  

<html xmlns=" http://www.w3.org/1999/xhtml">  

<head>

<title>XHR数据交换</title>

</head>  

<body>

<form action="index.php" method="post" onsubmit="return test()">

姓名:<input type="text" name="username"/><br />

年龄:<input type="text" name="age"/><br />

身高:<input type="text" name="sengao"/><br />

<input type="submit" />

</form>

<div></div>

<script type="text/javascript">

function test(){

//获取dom节点

var fm = document.getElementsByTagName('form')[0]

//利用HTML5 FormData对象获取表单数据

//并把DOM表单对象作为参数传给FormData

var fD = new FormData(fm)

//可以追加数据

fD.append('xuexing','A')

//创建XML请求

var xhr = new XMLHttpRequest()

//打开链接,异步请求

xhr.open('POST','index.php',true)

//发送表单数据

xhr.send(fD)

//事件响应

xhr.onreadystatechange = function (){

//接受到后台返回数据时,写入到div文本节点内

if(this.readyState == 4){

document.getElementsByTagName('div')[0].innerHTML = this.responseText

}

}

return false

}

</script>

</body>  

</html>