Ajax发送FormData对象封装的表单数据
前端页面：
<!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对象封装的表单数据的更多相关文章
- Ajax 使用formdata 实现 无刷新表单上传
FormData对象的作用就类似于这里的serialize()方法,不过FormData是浏览器原生的,且支持二进制文件 1.这里实现一个无刷新上传图片,成功后页面显示 点击button 触发隐藏的 ...
- ajax使用formdata 提交excel文件表单到rails解析
.modal-body .container-fluid .row .col-md-12 1.下载模板文件 = link_to '模板文件' .row .col-md-12 = form_tag '' ...
- JavaScript实现ajax发送表单数据
知识点: 1.重置表单数据 2.获取表单数据(纯JavaScript) 3.设置表单数据(纯JavaScript) 4.ajax发送数据到客户端 (1)设置请求头,自己组合数据 (2)实例化表单对象, ...
- 【ASP.NET Web API教程】5.2 发送HTML表单数据：URL编码的表单数据
原文:[ASP.NET Web API教程]5.2 发送HTML表单数据:URL编码的表单数据 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面的内 ...
- .Net之使用Jquery Ajax通过FormData对象异步提交图片文件到服务端保存并返回保存的图片路径
前言: 首先对于图片上传而言,在我们的项目开发中可以说出现的频率是相当的高的.这篇文章中,我将要描述的是在我们.Net中如何使用Jquery Ajax通过FormData对象异步提交图片文件到后台保存 ...
- 通过jQuery Ajax使用FormData对象上传文件
FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...
- 通过jQuery Ajax使用FormData对象上传文件 （转载）
XMLHttpRequest Level 2 添加了一个新的接口——FormData.与普通的 Ajax 相比,使用 FormData 的最大优点就是我们可以异步上传二进制文件.jQuery 2.0+ ...
- [转] 通过jQuery Ajax使用FormData对象上传文件
FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...
- ajax异步上传文件和表单同步上传文件 的区别
1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...
随机推荐
- Codeforces Round #201 (Div. 2) - C. Alice and Bob
题目链接:http://codeforces.com/contest/347/problem/C 题意是给你一个数n,然后n个数,这些数互不相同.每次可以取两个数x和y,然后可以得到|x - y|这个 ...
- Object类、instanceof
一.Object 1.所有类都默认继承至Object 2.两个常用的方法 2.1.toString:返回类的字符串描述,一般子类会重写用来打印属性 2.2.equals:默认比较两个对象的引用是否相同 ...
- [转]Oracle 操作字符串的函数
转至:http://yedward.net/?id=62 (1)oracle中实现截取字符串:substr substr(string, start_position, [length]) 其中,st ...
- Unity3D之Mecanim动画系统学习笔记（一）：认识Mecanim动画系统
Mecanim简介 Mecanim动画系统是Unity3D4.0开始引入的一套全新的动画系统,主要提供了下面4个方面的功能: 针对人形角色提供一套特殊的工作流. 动画重定向的能力,可以非常方便的把动画 ...
- 【Java】C/C++与Java的简单比较
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/5827273.html C/C++: 编译(不同的系统编译出不同的机器码,所以同一 ...
- CLR探索应用程序域世界(上):Windbg SOS剖析揭示域世界
在CLR的世界中,有一系列的令人Amazing的技术和架构.其中,CLR对应用程序在内存中内存分配,执行模型,程序之间的交互等一系列的技术,值得每一个致力于DotNet平台的技术人员深究. 编程人员在 ...
- 如何在Android中使用OpenCV
如何在Android中使用OpenCV 2011-09-21 10:22:35 标签:Android 移动开发 JNI OpenCV NDK 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始 ...
- Cloud Computing Deployment Models
Cloud computing can broadly be broken down into three main categories based on the deployment model. ...
- RSA前台js加密,后台C#解密
一.需求: 为了安全,项目中前台登陆用的密码需要加密传到后台,后台c#解密登陆密码. 二.解决方案 采用非对称加密算法RSA来达到目的,前台登陆页面一加载便发送一次ajax请求获取后台产生的公钥,用于 ...
- MongoDB 快速入门--中级
索引 ensureIndex 用来创建索引,需要注意的就是一个集合最多也就64个索引 如果没加所有就是表扫表,速度很慢, 当然如果索引的键有多个,就必须考虑顺序 拓展索引 同样的也可以为内嵌文档 建立 ...