在jquery的ajax函数中,可以传入3种类型的数据

  1. 文本:"uname=alice&mobileIpt=110&birthday=1983-05-12"
  2. json对象:{"uanme":"vic","mobileIpt":110,"birthday":"2013-11-11"}
  3. json数组:
  1. [
  2. {"name":"uname","value":"alice"},
  3. {"name":"mobileIpt","value":110},
  4. {"name":"birthday","value":"2012-11-11"}
  5. ]
  1. FormData对象:
  1. 它可以更灵活方便的发送表单数据,因为可以独立于表单使用,实现表单数据的序列化。
  2. 最大的好处是可以通过Ajax上传文件。如果它的字段类型不是Blob也不是File,则会被转换成字符串。
  3. 通过这种方式,可以非常方便的进行表单提交,直接表单转换成FormData对象即可。
  4. var fd = new FormData(document.querySelector("form"));
  5. data: fd,
  6. processData: false, // 不处理数据
  7. contentType: false // 不设置内容类型

第一种写法(把参数拼接在URL中,data属性设为空{ })

  1. var id = "a";
  2. var name = "语文";
  3. url:"/sell/login?id="+id+"&name="+name,
  4. data:{},

第二种写法(参数写成json数据形式)

  1. data:{
  2. 'name':'ld',
  3. 'user':'littledonkey'
  4. },

第三种写法(根据表单id属性,把表单封装数据,调用JQuery的serialize()方法序列化为字符串)

  1. 前提是:发送请求的必须是一个form表单,而且表单内要做参数的标签必须具有name属性,因为name属性会被认为请求参数名
  1. var params=$('#login').serialize(); //把id为login的form表单里的参数自动封装为参数传递
  2. data:params,
  3. 作用:序列表单内容为字符串。
  4. 参数:
  5. 返回值:表单内容的字符串格式
  6. serialize方法可以将表单序列化成一个拼接的字符串形式:
  7. username=a&address=b&age=c
  8. serializeArray方法可以将表单序列化成一个特殊的json数组,带有namevaluejson
  9. 返回值:返回的是JSON数组而非JSON字符串,返回格式为:
  10. [
  11. {name: 'firstname', value: 'Hello'},
  12. {name: 'lastname', value: 'World'},
  13. {name: 'alias'}
  14. ]
  15. 优化:
  16. 第一种方法:
  17. $.param(data); //将表单元素数组或者对象序列化。
  18. name=alice&mobileIpt=110&birthday=1983-05-12
  19. 如果被传递的对象在数组中,则必须是以 .serializeArray() 的返回值为格式的对象数组:
  20. [
  21. {name:"first",age:"12"},
  22. {name:"last",age:"11"},
  23. {name:"job",age:"5"}
  24. ]
  25. 第二种方法:
  26. 数组转换成对象:
  27. var data ={};
  28. $("form").serializeArray().map(function(val){
  29. data[val.name]=val.value;
  30. });
  31. 对象转换成json字符串:
  32. var myJSON = JSON.stringify(data );
  33. {"name": "first", "age": "12"}

第四种写法(拼接data)

  1. var id = "a";
  2. var name = "语文";
  3. //data: "id=" + id + "&name=" + $("#name").val(),
  4. data: "id=" + id + "&name=" + name,

JQuery Ajax 向后台传参方式的更多相关文章

  1. jQuery对象初始化的传参方式

    jQuery对象初始化的传参方式包括: 1.$(DOMElement) 2.$(' ... '), $('#id'), $('.class') 传入字符串, 这是最常见的形式, 这种传参数经常也传入第 ...

  2. ajax的data传参的两种方式

    ajax的data传参的两种方式 本文为转载. 1.[javascript] view plain copy /** * 订单取消 * @return {Boolean} 处理是否成功 */ func ...

  3. angularjs简单实现$http.post(CORS)跨域及$http.post传参方式模拟jQuery.post

    1.开启angularjs的CORS支持 .config(function($httpProvider) { // CORS post跨域配置 $httpProvider.defaults.useXD ...

  4. angular使用post、get向后台传参的问题

    一.问题的来源 我们都知道向后台传参可以使用get.put,其形式就类似于name=jyy&id=001.但是在ng中我却发现使用$http post进行异步传输的过程中后台是接收不到数据的. ...

  5. angularjs向后台传参,后台收不到数据

    angularjs中封装了一个$http服务,用来请求远程资源 参见:HTTP API 其中封装过的$http.post和$http.get使用起来比较方便 后台是php,用$_POST['name' ...

  6. AJAX - 封装的传参改为传入对象 XML JSON 数据格式

    Ajax封装函数,上次是直接传参,这次在原来的基础上改进,模仿jQuery 直接传入对象,把之前的参数都变为这个对象的属性. 这样可以随意调换传入数据的次序. 其他优点? 需要再复习一下. Ajax处 ...

  7. jQuery ajax调用后台aspx后台文件的两种常见方法(不是ashx)

    在asp.net webForm开发中,用Jquery ajax调用aspx页面的方法常用的有两种:下面我来简单介绍一下. [WebMethod] public static string SayHe ...

  8. Web API中的传参方式

    在Restful风格的WebApi的里面,API服务的增删改查,分别对应着Http Method的Get / Post / Delete /Put,下面简单总结了Get / Post /Delete ...

  9. 原生js中用Ajax进行get传参

    原生js中用Ajax进行get传参 案例: <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

随机推荐

  1. 网络编程之 OSI七层协议

    内容目录: 1.软件开发架构 2.OSI七层协议 3.每层协议介绍 1.软件开发架构 c/s架构: c:客户端 s:服务端 b/s架构: b:浏览器 s:服务器 本质:b/s其实也是c/s 2.OSI ...

  2. 读书笔记一、numpy基础--创建数组

    创建ndarray   (1)使用array函数 接受一切序列型的对象(包括其他数组),然后产生一个新的含有传入数据的numpy数组. import numpy as np #将一个由数值组成列表作为 ...

  3. Mycat搭建负载均衡,读写分离的Mysql集群

    Mycat搭建负载均衡,读写分离的Mysql集群 准备环境 1.mysql-5.7.24-linux-glibc2.12-x86_64.tar.gz 2.Mycat-server-1.6.7.4-te ...

  4. Shell test命令(Shell [])详解,附带所有选项及说明

    test 是 Shell 内置命令,用来检测某个条件是否成立.test 通常和 if 语句一起使用,并且大部分 if 语句都依赖 test. test 命令有很多选项,可以进行数值.字符串和文件三个方 ...

  5. C#反射从入门到放弃(这部分遇到的新东西太多了让人接受不能)

    首先,我们需要知道type,type是类型的类型(笑 官方点的说法是,BCL声明了一个Type抽象类,它被设计用来包含类型的特性, 使用这个类的对象(抽象类的对象?这显然是错误的,但是这里用的其实是T ...

  6. python编程学习day04

    1.函数名是变量名 “=”是内存指向,等号赋值操作,内存指向操作 变量——可赋值,可作为列表元素 函数名可以作为返回值返回 函数名可作为参数传递 2.闭包 内层函数使用了外层函数的变量 作用:可以让一 ...

  7. Linux环境相关

    Linux环境相关 CentOS7网络配置静态ip CentOS7查看ip地址:以前是ifconfig,现在变成了 ip addr 当然这是配置好环境最后的结果,刚装好系统时时没有下面的ens33的相 ...

  8. php-fpm 服务

    编译安装PHP的时候已经加入了--enable-fpm 在此基础上启动php-fpm服务 cp /usr/local/php/etc/php-fpm.conf.default /usr/local/p ...

  9. 再学 GDI+文本输出文本样式

    代码文件: unit Unit1; interfaceuses   Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls ...

  10. NX二次开发-NXOPEN找相切面方法ScRuleFactory()->CreateRuleFaceTangent

    #include <uf_defs.h> #include <uf_ui_types.h> #include <iostream> #include <NXO ...