前端页面：

<!doctype html>

<html lang="en">

 <head>

  <meta charset="UTF-8">

  <meta name="Generator" content="EditPlus®">

  <meta name="Author" content="">

  <meta name="Keywords" content="">

  <meta name="Description" content="">

  <title>formdata对象封装表单数据</title>

<script type="text/javaScript">

function send(){

	var xhr=new XMLHttpRequest();

	xhr.open('POST','./01.php',true);//异步传输

	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');

	var fm=document.getElementsByTagName('form')[0];

	var fd=new FormData(fm);

	xhr.onreadystatechange=function(){

		if(this.readyState==4){

			document.getElementById('username').innerHTML=xhr.responseText;

		}

	}

	fd.append('act','zhuce');

	xhr.send(fd);

}

</script>

 </head>

 <body>

	<form action="./01.php" method="post">

		<p>用户名：<input type="text" name="username"/><span id="username"></span></p>

		<p>密码：<input type="password" name="pwd"/></p>

		<p>邮箱地址：<input type="text" name="eamil"/></p>

		<input type="button" value="注册" onclick="send()">

	</form>

 </body>

</html>

php接收页面

<?php

print_r($_POST);

$name=Array('test111','admin','Admin');

if(isset($_POST)){

	if(in_array($_POST['username'],$name)){

		echo '用户名已经注册';

	}else{

		echo '可以注册';

	}

}

?>

出现以下错误

解决办法

将XMLHTTPRequest对象设置的头信息

xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');

删掉或注释就可以了

Ajax发送FormData对象封装的表单数据的更多相关文章

  1. Ajax 使用formdata 实现 无刷新表单上传

    FormData对象的作用就类似于这里的serialize()方法,不过FormData是浏览器原生的,且支持二进制文件 1.这里实现一个无刷新上传图片,成功后页面显示 点击button 触发隐藏的 ...

  2. ajax使用formdata 提交excel文件表单到rails解析

    .modal-body .container-fluid .row .col-md-12 1.下载模板文件 = link_to '模板文件' .row .col-md-12 = form_tag '' ...

  3. JavaScript实现ajax发送表单数据

    知识点: 1.重置表单数据 2.获取表单数据(纯JavaScript) 3.设置表单数据(纯JavaScript) 4.ajax发送数据到客户端 (1)设置请求头,自己组合数据 (2)实例化表单对象, ...

  4. 【ASP.NET Web API教程】5.2 发送HTML表单数据：URL编码的表单数据

    原文:[ASP.NET Web API教程]5.2 发送HTML表单数据:URL编码的表单数据 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面的内 ...

  5. .Net之使用Jquery Ajax通过FormData对象异步提交图片文件到服务端保存并返回保存的图片路径

    前言: 首先对于图片上传而言,在我们的项目开发中可以说出现的频率是相当的高的.这篇文章中,我将要描述的是在我们.Net中如何使用Jquery Ajax通过FormData对象异步提交图片文件到后台保存 ...

  6. 通过jQuery Ajax使用FormData对象上传文件

    FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...

  7. 通过jQuery Ajax使用FormData对象上传文件 （转载）

    XMLHttpRequest Level 2 添加了一个新的接口——FormData.与普通的 Ajax 相比,使用 FormData 的最大优点就是我们可以异步上传二进制文件.jQuery 2.0+ ...

  8. [转] 通过jQuery Ajax使用FormData对象上传文件

    FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...

  9. ajax异步上传文件和表单同步上传文件 的区别

    1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...

随机推荐

  1. java操作redis之jedis篇

    首先来简单介绍一下jedis,其实一句话就可以概括的,就是java操作redis的一种api.我们知道redis提供了基本上所有常用编程语言的clients,大家可以到http://redis.io/ ...

  2. java命令行运行jar里的main类

    一般运行包含manifest的jar包,可以使用 java -jar <jar-file-name>.jar 如果jar里没有 manifest,则可以使用 java -cp foo.ja ...

  3. Protobuf一键生成代码bat文件

    最近在摆弄Unity的Socket,需要用到Protobuf,一般都会有多个协议文件,所以研究了下bat的批处理,下面给出批处理文件代码: @echo off ::协议文件路径, 最后不要跟“\”符号 ...

  4. JS 的点点滴滴

    1. ||含义 : 返回第一个有效值 eg : <script type="text/javascript"> var a=""; var c = ...

  5. hdu 2553 N皇后问题 (经典DFS)

    题目链接:点击链接 思路:用一维数组hang[num] = i,num表示第num行,i表示第i列,计算n = 1~10皇后的不同放置数量,然后打表 #include<stdio.h> # ...

  6. cocos2d-x 手电筒效果

    转自:http://blog.csdn.net/xujiezhige/article/details/8448524# 常见的手电筒效果,可以通过CCRenderTexture来实现.主要是通过修改渲 ...

  7. Codeforces Gym 100513M M. Variable Shadowing 暴力

    M. Variable Shadowing Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/100513/ ...

  8. 怎样配置Tomcat环境变量

    JDK环境变量配置:      假设你的安装JDK在C盘里,如:C:\Program Files\Java\jdk1.6.0_05,那么就在系统变量里(当然也能够在用户变量里)点新建:      变量 ...

  9. mybatis 关联映射传递多参数方法

    <resultMap type="com.secoo.my.bean.OrderItemComment" id="orderItemResult"> ...

  10. Nhibernate中 Many-To-One 中lazy="proxy" 延迟不起作用的原因

    2010-07-15 12:10 by 彭白洋, 322 阅读, 0 评论, 收藏, 编辑 NHibernate中 Many-To-One 中lazy="proxy" 延迟不起作用 ...