jquery serialize()、serializearray()已经$.param方法

serialize:

序列表表格内容为字符串,用于 Ajax 请求。可以对整个form,也可以只针对某部分。

HTML 代码:
<p id="results"><b>Results: </b> </p>
<form>
  <select name="single">
    <option>Single</option>
    <option>Single2</option>
  </select>
  <select name="multiple" multiple="multiple">
    <option selected="selected">Multiple</option>
    <option>Multiple2</option>
    <option selected="selected">Multiple3</option>
  </select><br/>
  <input type="checkbox" name="check" value="check1"/> check1
  <input type="checkbox" name="check" value="check2" checked="checked"/> check2
  <input type="radio" name="radio" value="radio1" checked="checked"/> radio1
  <input type="radio" name="radio" value="radio2"/> radio2
</form>
jQuery 代码:
$("#results").append( "<tt>" + $("form").serialize() + "</tt>" );

$(‘#form‘).submit(function(event){
event.preventDefault();

$.ajax({
url:‘ ‘,
type:‘post‘,
data:$("form").serialize(),

}

参考:http://api.jquery.com/serialize/

serializeArray():

Encode a set of form elements as an array of names and values.

定义和用法

serializeArray() 方法通过序列化表单值来创建对象数组(名称和值)。

您可以选择一个或多个表单元素(比如 input 及/或 textarea),或者 form 元素本身。

语法

$(selector).serializeArray()

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

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

返回的 JSON 对象是由一个对象数组组成的,其中每个对象包含一个或两个名值对 —— name 参数和 value 参数(如果 value 不为空的话)。举例来说:

[
  {name: ‘firstname‘, value: ‘Hello‘},
  {name: ‘lastname‘, value: ‘World‘},
  {name: ‘alias‘}, // 值为空
]

.serializeArray() 方法使用了 W3C 关于 successful controls(有效控件) 的标准来检测哪些元素应当包括在内。特别说明,元素不能被禁用(禁用的元素不会被包括在内),并且元素应当有含有 name 属性。提交按钮的值也不会被序列化。文件选择元素的数据也不会被序列化。

该方法可以对已选择单独表单元素的对象进行操作,比如 <input>, <textarea>, 和 <select>。不过,更方便的方法是,直接选择 <form> 标签自身来进行序列化操作。

$("form").submit(function() {
  console.log($(this).serializeArray());
  return false;
});

上面的代码产生下面的数据结构(假设浏览器支持 console.log):

[
  {
    name: a
    value: 1
  },
  {
    name: b
    value: 2
  },
  {
    name: c
    value: 3
  },
  {
    name: d
    value: 4
  },
  {
    name: e
    value: 5
  }
]

取得表单内容并插入到网页中:

<p><b>Results:</b> <span id="results"></span></p>
<form>
  <select name="single">
    <option>Single</option>
    <option>Single2</option>
  </select>
  <select name="multiple" multiple="multiple">
    <option selected="selected">Multiple</option>
    <option>Multiple2</option>
    <option selected="selected">Multiple3</option>
  </select>
  <br>
  <input type="checkbox" name="check" value="check1" id="ch1">
  <label for="ch1">check1</label>
  <input type="checkbox" name="check" value="check2" checked="checked" id="ch2">
  <label for="ch2">check2</label>
  <input type="radio" name="radio" value="radio1" checked="checked" id="r1">
  <label for="r1">radio1</label>
  <input type="radio" name="radio" value="radio2" id="r2">
  <label for="r2">radio2</label>
</form>

<script>
  function showValues() {
    var fields = $( ":input" ).serializeArray();
    $( "#results" ).empty();
    jQuery.each( fields, function( i, field ) {
      $( "#results" ).append( field.value + " " );
    });
  }

  $( ":checkbox, :radio" ).click( showValues );
  $( "select" ).change( showValues );
  showValues();
</script>

</body>
</html>

$(":input")                  选择所有的表单输入元素,包括input, textarea, select 和 button.

参考:http://www.w3school.com.cn/jquery/ajax_serializearray.asp
http://api.jquery.com/serializeArray/

$.params()

序列化一个 key/value 对象:

var params = { width:1900, height:1200 };
var str = jQuery.param(params);
$("#results").text(str);

结果:

width=1680&height=1050参考:http://www.w3school.com.cn/jquery/ajax_param.asp

jquery serialize()、serializearray()已经$.param方法,布布扣,bubuko.com

时间: 2024-10-13 16:19:28

jquery serialize()、serializearray()已经$.param方法的相关文章

jQuery的序列化元素 serialize()方法 serializeArray()方法 param()方法

当提交的表单元素较多时用serialize()方法,serialize()方法也是作用于一个jQuery的对象,它能够将DOM元素内容序列化为字符串,用于Ajax请求. serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. .serialize() 方法可以操作已选取个别表单元素的 jQuery 对象,比如 <input>, <textarea> 以及 <select>.不过,选择 <form> 标签本身进行序列化一般更容易些: $(

JQuery中serialize()、serializeArray()和param()的使用方法

1. serialize()方法语法:$(selector).serialize()输出序列化表单的字符串,文件上传控件(例如:<input type="file" name="myfile"/>)类型的表单数据会被自动忽略,也就是说不会出现在序列化字符串中. 比如有下面这样的一个表单,用$("form").serialize()序列化后得到的结果是:a=1&b=2&c=3 <form> <div&g

jQuery源码中的Ajax--serialize()/serializeArray()/param()方法

由于jQueryObject.serialize()方法的核心是$.param()方法,所以先学习$.param()方法. 一.$.param()方法 $.param()方法是用来对一个数组或对象按照key/value进行序列化,以便用于URL查询字符串或AJAX请求.其返回的字符串已经过URL编码处理(采用的字符集为UTF-8). 语法: jQuery.param( obj [, traditional ] ) 参数如下: 参数 描述 obj 需要被序列化的JS对象. traditional

JQuery中serialize()、serializeArray()和param()用法举例

在javascript中,serialize()方法也是作用于一个JQuery对象,它能够将DOM元素内容序列化为字符串,serializeArray()方法不是返回字符串,而是将DOM元素序列化后,返回JSON格式的数据. 服务器端的jsp代码: <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% request.setCharacte

jQuery_review之使用jQuery的Ajax必须知道的,serialize、param方法以及全局函数

在项目中可能会碰到这样的几个问题: 第一个问题,我们需要实现一个基于ajax的异步程序,我们也相当的熟悉ajax中是可以通过{name:name,address:address}这种方式来进行传递参数的.但是,当任务下达的那一刻,我们发现前端的form表单非常的庞大,庞大的我没有耐心去一个一个的拼字符串. 第二个问题,我们需要将一个充满的checkbox的用户调查表传递给后台,额,难道需要我们写一个过滤器,然后通过each进行遍历,然后拼成这样的一个参数表么?如果你对jQuery的选择器比较了解

jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法

原始form表单值获取方式(手动): $.ajax({ type: "POST", url: "ajax.php", data: "Name=摘取天上星&position=IT技术", success: function(msg){alert(msg);}, error: function(error){alert(error);} }); JQ serialize()方法取值: $.ajax({ type: "POST&quo

jquery param()方法的使用

jQuery.param()函数用于将一个JS数组或对象序列化为字符串值,将jquery对象按照name/value 或者key/value序列化为URL参数,用&连接.以便用于URL查询字符串或AJAX请求. 语法 $.param(object,trad) 参数说明 object:必需.规定要序列化的数组或对象. trad:可选.布尔值,指定是否使用参数序列化的传统样式. 实例 var v1 = $.param( true ); // "" var v2 = $.param(

jQuery - 基于serializeArray的serializeObject

原文地址 http://blog.csdn.net/flashdelover/article/details/8185775 jQuery有方法$.fn.serialize,可将表单序列化成字符串:有方法$.fn.serializeArray,可将表单序列化成数组.如果需要其序列化为JSON对象,那么可以基于serializeArray编写方法serializeObject轻松实现: //work with jQuery 1.x jQuery.prototype.serializeObject=

jquery.serialize

jQuery - serialize() 方法 erialize() 方法通过序列化表单值,创建 URL 编码文本字符串. serialize()函数用于序列化一组表单元素,将表单内容编码为用于提交的字符串. serialize()函数常用于将表单内容序列化,以便用于AJAX提交. 该函数主要根据用于提交的有效表单控件的name和value,将它们拼接为一个可直接用于表单提交的文本字符串,该字符串已经过标准的URL编码处理(字符集编码为UTF-8). 该函数不会序列化不需要提交的表单控件,这和常