表单发送json数据

一、表单默认支持的几种数据处理类型

A、表单通过enctype属性可以指定数据发送时处理的格式

• application/x-www-form-urlencoded（默认）这种方式只能发送文本数据，键值对之间用&号连接。不指定enctype就都是此种方式
• multipart/form-data  此种方式，直接使用二进制编码，当要上传文件时就必须指定此种编码方式
• text/plain 此种编码方式，直接使用空格变换为+号的方式，但是不对特殊字符编码（不常用）

二、将表单数据转化为json发送

A、由上面三种默认方式我们知道，默认的几种方式都无法将数据转化为JSON数据，所以我们需要引入ajax技术

B、什么是AJAX（Asynchronous Javascript And XML）由，它是一种再不改变页面结构的同时动态更新页面局部信息的思想，xml是前后端数据传输的数据格式，但是现在这种格式已经不常用，前后端经常使用JSON格式的数据来交互数据。

C、XmlHttpRequest对象就实现了这个思想，它能够将数据发送到指定路径的后端服务器，然后根据后端反馈状态等来接收后端返回数据，从而达到返回数据更新到页面的功能，当然也可以再发送之前设定Content-Type等请求头信息。

D、使用XmlHttpRequest对象将Json数据传到后端。

• 大概思路是首先监测表单的提交事件，然后阻止事件默认行为，之后获取表单中所有元素，将这些元素value和name利用循环添加到一个对象结构体中，再利用JSON这个对象的stringty方法将js对象转换为json对象，最后设置请求头发送数据，监测返回内容写入页面。
• 这里利用了一些后端的thymeleaf技术，可以将th:value语法当作值来当作value来对待，重点不在这上面。

  姓名:

  性别:男

      女

  学号: 

  学院: 
             文法学院
             软件学院
             建艺学院
              医学院
      

  专业班级:

  电话：

  

• 最后说明，上面例子中后端返回的是一个html页面，所以，直接写到原文档覆盖了。