serializearray？js 有没有类似serializearray的功能

编程之家2023-11-03103次浏览

尊敬的读者，serializearray和js 有没有类似serializearray的功能是当前备受关注的话题，但许多人对其仍存在疑惑。在本篇文章中，我将为你提供清晰的解释和深入的分析，希望能满足你的求知欲望。

js 有没有类似serializearray的功能

1、serialize()方法

序列化表单内容为字符串,用于Ajax请求。

格式：var data=$("form").serialize();

2.serializeArray()方法

序列化表单元素(类似'.serialize()'方法)返回JSON数据结构数据。

注意,此方法返回的是JSON对象而非JSON字符串。需要使用插件或者<a>第三方库</a>进行字符串化操作。

格式：var jsonData=$("form").serializeArray();

在使用ajax提交表单数据时,以上两种方法都可以将data参数设置为$("form").serialize()或$("form").serializeArray()。

servlet怎么解析jquery通过serialize提交的表单

下面是服务器端的jsp代码：

与JQuery中其他方法一样，serialize()方法也是作用于一个JQuery对象，它能够将DOM元素内容序列化为字符串，用于ajax请求。通过使用serialize()方法，可以提交本页面的所有域，代码如下：

当单击“提交”按钮后，所有属于form1的表单元素都能提交到后台，即使在表单中再增加字段，脚本仍然能够使用，并且不需要做其他多余工作。

用字符串方式时，需要注意对字符编码（中文问题），如果不希望编码带来麻烦，可以使用serialize()方法，它会自动编码。

因为serialize()方法作用于JQuery对象，所以不光只有表单能使用它，其他选择器选取的元素也都能使用它，如以下JQuery代码：

$(":checkbox,:radio").serialize()

把复选框和单选框的值序列化为字符串形式，只会将选中的值序列化。

在JQuery中还有一个与serialize()类似的方法--serializeArray()，该方法不是返回字符串，而是将DOM元素序列化后，返回JSON格式的数据。JQuery代码如下：

var fields=$(":checkbox,:radio").serializeArray()

console.log(fields);//用FireBug输出

$.param()方法是serialize()方法的核心，用来对一个数组或对象按照key/value进行序列化。

比如将一个普通的对象序列化：

var obj={a:1,b:2,c:3}

var k=$.param(obj)

alert(k);//输出a=1&b=2&c=3

spring mvc 怎样接收formdata

表单的代码如下：

<%@ 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>

//添加用户

function addUser(){

var form= document.forms[0];

form.action="${pageContext.request.contextPath}/user/addUser1";

//form.action="${pageContext.request.contextPath}/user/addUser2";

//form.action="${pageContext.request.contextPath}/user/addUser3";

form.method="post";

form.submit();

}

</script>

</head>

<body>

<form>

<table>

<tr>

<td>

</td>

</tr>

<tr>

<td>

</td>

</tr>

<tr>

<td>

</td>

</tr>

</table>

</form>

</body>

</html>

1、直接把表单的参数写在Controller相应的方法的形参中

@RequestMapping("/addUser1")

public String addUser1(String userName,String password){

System.out.println("userName is:"+userName);

System.out.println("password is:"+password);

return"/user/success";

}

2、通过HttpServletRequest接收

@RequestMapping("/addUser2")

public String addUser2(HttpServletRequest request){

String userName= request.getParameter("userName");

String password= request.getParameter("password");

System.out.println("userName is:"+userName);

System.out.println("password is:"+password);

return"/user/success";

}

3、通过一个bean来接收

1）建立一个和表单中参数对应的bean

public class User{

private String userName;

private String password;

public String getUserName(){

return userName;

}

public void setUserName(String userName){

this.userName= userName;

}

public String getPassword(){

return password;

}

public void setPassword(String password){

this.password= password;

}

2）用这个bean来封装接收的参数

@RequestMapping("/addUser3")

public String addUser3(User user){

System.out.println("userName is:"+user.getUserName());

System.out.println("password is:"+user.getPassword());

return"/user/success";

}

4、通过json数据接收

<%@ 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>

$(document).ready(function(){

$("#button_submit").click(function(){

var name=$("#userName").val();

var pass=$("#password").val();

var user={userName:name,password:pass};//拼装成json格式

$.ajax({

type:"POST",

url:"${pageContext.request.contextPath}/user/addUser4",

data:user,

success:function(data){

alert("成功");

error:function(e){

alert("出错："+e);

}

});

</script>

</head>

<body>

<form>

<table>

<tr>

<td>

</td>

</tr>

<tr>

<td>

</td>

</tr>

<tr>

<td>

</td>

</tr>

</table>

</form>

</body>

</html>

依然可以使用bean来接收json数据

@RequestMapping("/addUser4")

public String addUser4(User user){

System.out.println("userName is:"+user.getUserName());

System.out.println("password is:"+user.getPassword());

return"/user/success";

}

5、使用jQuery的serializeArray()方法序列化表单元素

如果表单元素很多，手工拼装成json数据非常麻烦，可以使用jQuery提供的serializeArray()方法序列化表单元素，返回json数据结构数据。

<%@ 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>

$(document).ready(function(){

$("#button_submit").click(function(){

//序列化表单元素，返回json数据

var params=$("#userForm").serializeArray();

//也可以把表单之外的元素按照name value的格式存进来

//params.push({name:"hello",value:"man"});

$.ajax({

type:"POST",

url:"${pageContext.request.contextPath}/user/addUser5",

data:params,

success:function(data){

alert("成功");

error:function(e){

alert("出错："+e);

}

});

</script>

</head>

<body>

<table>

<tr>

<td>

</td>

</tr>

<tr>

<td>

</td>

</tr>

<tr>

<td>

</td>

</tr>

</table>

</form>

</body>

</html>

依然可以使用bean来接收json数据：

@RequestMapping("/addUser5")

public String addUser5(User user){

System.out.println("userName is:"+user.getUserName());

System.out.println("password is:"+user.getPassword());

return"/user/success";

}

感谢您的阅读！希望本文对解决您关于serializearray和js 有没有类似serializearray的功能的问题有所帮助。如果您还有其他疑问，欢迎随时向我们提问。