ajax post(copy part)
var q=new XMLHttpRequest();
var data='usr=weidiao&pwd=haha';
data=encodeURI(data);
var url="xxxxxx";
q.open("post",url);
q.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
q.onreadystatechange=function(){
}
q.send(data);
一般来说form中存放数据的控件主要是<input>,而这个<input>type很多,如 ‘submit’,‘hidden’, ‘password’, ‘text’,‘checkbox’, ‘radio’等。因此第一步我们要做的就是先写一个方法,将将form中各种类型的<input>将数据值给抠出来。具体见如下代码:
- //获取指定form中的所有的<input>对象
- function getElements(formId) {
- var form = document.getElementById(id);
- var elements = new Array();
- var tagElements = form.getElementsByTagName('input');
- for (var j = 0; j < tagElements.length; j++)
- elements.push(tagElements[j]);
- return elements;
- }
接着我们需要获取每个input对象的name-value对,代码如下:
- function inputSelector(element) {
- if (element.checked)
- return [element.name, element.value];
- }
- function input(element) {
- switch (element.type.toLowerCase()) {
- case 'submit':
- case 'hidden':
- case 'password':
- case 'text':
- return [element.name, element.value];
- case 'checkbox':
- case 'radio':
- return inputSelector(element);
- }
- return false;
- }
接着我们就可以将所有这些input对象中的name-value对以图1-5中POSTDATA那样的格式组织起来。代码如下:
- function serializeElement(element) {
- var method = element.tagName.toLowerCase();
- var parameter = input(element);
- if (parameter) {
- var key = encodeURIComponent(parameter[0]);
- if (key.length == 0) return;
- if (parameter[1].constructor != Array)
- parameter[1] = [parameter[1]];
- var values = parameter[1];
- var results = [];
- for (var i=0; i<values.length; i++) {
- results.push(key + '=' + encodeURIComponent(values[i]));
- }
- return results.join('&');
- }
- }
- function serializeForm(formId) {
- var elements = getElements(formId);
- var queryComponents = new Array();
- for (var i = 0; i < elements.length; i++) {
- var queryComponent = serializeElement(elements[i]);
- if (queryComponent)
- queryComponents.push(queryComponent);
- }
- return queryComponents.join('&');
- }
ajax post(copy part)的更多相关文章
- 超简单!80行代码实现Google日历(拖放、移动、AJAX)
介绍 本实例介绍使用DayPilot Lite for ASP.NET MVC library 类来实现类google日历效果. 在线实例 天视图 星期视图 拖放调整 拖放移动 行代码来实现a ...
- 超级简单!80行代码实现Google日历(拖放、移动、AJAX)
行代码实现Google日历 Introduction 本实例介绍使用DayPilot Lite for ASP.NET MVC library 类来实现类google日历效果. 在线实例 天视图 星 ...
- VSCompile
VS2012加载失败 No exports were found that match the constraint 开始->运行->devenv.exe /resetuserdata-& ...
- HEC-ResSim原文档
HEC-ResSim Reservoir System Simulation User's Manual Version 3.1 May 201 ...
- jQuery之ajax实现篇
jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...
- 通过Ajax使用FormData对象无刷新上传文件
写在前面:本文说的这个方案有浏览器兼容性问题:所有主流浏览器的较新版本已经支持这个对象了,比如Chrome 7+.Firefox 4+.IE 10+.Opera 12+.Safari 5+,对兼容性比 ...
- Struts2与Ajax的整合
整合: 导入jar包 sturts2-json-plugin-2.1.8.1.jar 说明: 在该jar包中有struts-plugin.xml文件 <struts> ...
- ajax的status为201依然触发jquery的error事件的问题
昨天在调试一个ajax的时候发现,即使status是201,仍然会触发jquery的error事件.statusText是"parseerror". 通过在stackoverflo ...
- CS0234: 命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Html、Ajax”(是否缺少程序集引用?)
从SVN上down下来的程序,编译报了一大堆的错,发现是缺少引用,但是明明引用了,后来打开引用,发现system.web.mvc这个引用打着叹号,如图: 后来重新引用了本机的system.web.mv ...
随机推荐
- linux 查看静态库,动态库是32位还是64位
动态库: file xxx.so 静态库 objdump -a xxx.a
- day 2 常用快捷键
tab命令或路径补全**,linux里最有用的快捷键,如果tab不到路径或命令,就代表没有这个路径或者命令,还有可能是权限不对. ctrl+c :终止当前任务命令或程序. ctrl+d 退出当前用户环 ...
- android The public type classname must be defined in its own file 报错
The public type classname must be defined in its own file classname 为类名 错误提示,公用的类必髯有自己拥有独立.java文件 解 ...
- 利用NuSoap开发WebService(PHP)
利用NuSoap开发WebService(PHP) 分类: php 2010-09-08 12:00 5005人阅读 评论(1) 收藏 举报 webservicephpsoapstringencodi ...
- MMORPG大型游戏设计与开发(客户端架构 part2 of vgui)
这一节我将讲解vgui的基础系统部分,也是该库提供给外部使用的一些重要接口.作为UI部分比较重要的部分,该节有着至关重要的部分,如果没有看到上一节内容,请留意下面的连接.我们现在可以猜想一下在客户端U ...
- sobel算子原理及opencv源码实现
sobel算子原理及opencv源码实现 简要描述 sobel算子主要用于获得数字图像的一阶梯度,常见的应用和物理意义是边缘检测. 原理 算子使用两个33的矩阵(图1)算子使用两个33的矩阵(图1)去 ...
- 123——Appium Girls活动
有感于Ruby Girls和Python Girls,在15年就想组织一次移动测试的妹子活动,框架选择Appium, 从15年夏天开始准备,申请Google的会议室,招募教练,开放报名,审核报名,到正 ...
- app微信支付(一) - 微信支付基本业务流程解析
想必微信支付是现在很多朋友离不开的一个功能,不论是扫描支付还是公众号支付或者app端支付,基本的思路都是一样的,之前做过支付宝支付以及中国移动支付接口,这几天花时间讲讲微信支付吧 先看一下微信支付的时 ...
- android学习疑问汇兑
一. anroid开发精要是提到. 1. 每一个android应用只有 16MB 的堆空间? 这个如何解释? 2. 服务组件没有运行在独立的进程或者线程中,而是与其他的android组件一样,运行主线 ...
- 1,字符是否为空,2,比较两个字符大小。String.Compare(String, String)。string.IsNullOrEmpty(string)
1, String.Compare 方法 (String, String) 比较两个指定的 String 对象. 值 条件 小于零 strA 小于 strB. 零 strA 等于 strB. 大于零 ...