JQuery中serialize()、serializeArray()和param()方法

    

        JQuery中serialize()、serializeArray()和param()方法             

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

[java]
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%  
  3.   request.setCharacterEncoding("UTF-8");  
  4.   String username = request.getParameter("username");  
  5.   String content = request.getParameter("content");  
  6.   out.println("<div class='comment'><h6> "+username+" :</h6><p class='para'> "+content+"  
  7.   
  8.                </p></div>");  
  9. %>  
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
  request.setCharacterEncoding("UTF-8");
  String username = request.getParameter("username");
  String content = request.getParameter("content");
  out.println("<div class='comment'><h6> "+username+" :</h6><p class='para'> "+content+"

               </p></div>");
%>

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

[javascript]
  1. $("#send").click(function(){  
  2.   
  3.      $.get("get1.jsp", $("#form1").serialize(), function(data, textStatus)  
  4.   
  5.               $("#resText").html(data);  
  6.   
  7.      });  
  8.   
  9. });  
$("#send").click(function(){

     $.get("get1.jsp", $("#form1").serialize(), function(data, textStatus)

              $("#resText").html(data);

     });

});

当单击“提交”按钮后,所有属于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

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

[java]
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%  
  3.   request.setCharacterEncoding("UTF-8");  
  4.   String username = request.getParameter("username");  
  5.   String content = request.getParameter("content");  
  6.   out.println("<div class='comment'><h6> "+username+" :</h6><p class='para'> "+content+"  
  7.   
  8.                </p></div>");  
  9. %>  
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
  request.setCharacterEncoding("UTF-8");
  String username = request.getParameter("username");
  String content = request.getParameter("content");
  out.println("<div class='comment'><h6> "+username+" :</h6><p class='para'> "+content+"

               </p></div>");
%>

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

[javascript]
  1. $("#send").click(function(){  
  2.   
  3.      $.get("get1.jsp", $("#form1").serialize(), function(data, textStatus)  
  4.   
  5.               $("#resText").html(data);  
  6.   
  7.      });  
  8.   
  9. });  
$("#send").click(function(){

     $.get("get1.jsp", $("#form1").serialize(), function(data, textStatus)

              $("#resText").html(data);

     });

});

当单击“提交”按钮后,所有属于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

猜你喜欢

转载自blog.csdn.net/u012156165/article/details/22934709