srcpage

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>将数据值给抠出来。具体见如下代码:

  1. //获取指定form中的所有的<input>对象
  2. function getElements(formId) {
  3. var form = document.getElementById(id);
  4. var elements = new Array();
  5. var tagElements = form.getElementsByTagName('input');
  6. for (var j = 0; j < tagElements.length; j++)
  7. elements.push(tagElements[j]);
  8. return elements;
  9. }

接着我们需要获取每个input对象的name-value对,代码如下:

  1. function inputSelector(element) {
  2. if (element.checked)
  3. return [element.name, element.value];
  4. }
  5. function input(element) {
  6. switch (element.type.toLowerCase()) {
  7. case 'submit':
  8. case 'hidden':
  9. case 'password':
  10. case 'text':
  11. return [element.name, element.value];
  12. case 'checkbox':
  13. case 'radio':
  14. return inputSelector(element);
  15. }
  16. return false;
  17. }

接着我们就可以将所有这些input对象中的name-value对以图1-5中POSTDATA那样的格式组织起来。代码如下:

  1. function serializeElement(element) {
  2. var method = element.tagName.toLowerCase();
  3. var parameter = input(element);
  4. if (parameter) {
  5. var key = encodeURIComponent(parameter[0]);
  6. if (key.length == 0) return;
  7. if (parameter[1].constructor != Array)
  8. parameter[1] = [parameter[1]];
  9. var values = parameter[1];
  10. var results = [];
  11. for (var i=0; i<values.length; i++) {
  12. results.push(key + '=' + encodeURIComponent(values[i]));
  13. }
  14. return results.join('&');
  15. }
  16. }
  17. function serializeForm(formId) {
  18. var elements = getElements(formId);
  19. var queryComponents = new Array();
  20. for (var i = 0; i < elements.length; i++) {
  21. var queryComponent = serializeElement(elements[i]);
  22. if (queryComponent)
  23. queryComponents.push(queryComponent);
  24. }
  25. return queryComponents.join('&');
  26. }

ajax post(copy part)的更多相关文章

  1. 超简单!80行代码实现Google日历(拖放、移动、AJAX)

    介绍 本实例介绍使用DayPilot Lite for ASP.NET MVC library 类来实现类google日历效果. 在线实例 天视图  星期视图  拖放调整  拖放移动  行代码来实现a ...

  2. 超级简单!80行代码实现Google日历(拖放、移动、AJAX)

    行代码实现Google日历 Introduction 本实例介绍使用DayPilot Lite for ASP.NET MVC library 类来实现类google日历效果. 在线实例 天视图  星 ...

  3. VSCompile

    VS2012加载失败 No exports were found that match the constraint 开始->运行->devenv.exe /resetuserdata-& ...

  4. HEC-ResSim原文档

              HEC-ResSim Reservoir System Simulation             User's Manual       Version 3.1 May 201 ...

  5. jQuery之ajax实现篇

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...

  6. 通过Ajax使用FormData对象无刷新上传文件

    写在前面:本文说的这个方案有浏览器兼容性问题:所有主流浏览器的较新版本已经支持这个对象了,比如Chrome 7+.Firefox 4+.IE 10+.Opera 12+.Safari 5+,对兼容性比 ...

  7. Struts2与Ajax的整合

    整合: 导入jar包 sturts2-json-plugin-2.1.8.1.jar 说明: 在该jar包中有struts-plugin.xml文件 <struts>            ...

  8. ajax的status为201依然触发jquery的error事件的问题

    昨天在调试一个ajax的时候发现,即使status是201,仍然会触发jquery的error事件.statusText是"parseerror". 通过在stackoverflo ...

  9. CS0234: 命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Html、Ajax”(是否缺少程序集引用?)

    从SVN上down下来的程序,编译报了一大堆的错,发现是缺少引用,但是明明引用了,后来打开引用,发现system.web.mvc这个引用打着叹号,如图: 后来重新引用了本机的system.web.mv ...

随机推荐

  1. linux 查看静态库,动态库是32位还是64位

    动态库: file xxx.so 静态库 objdump -a xxx.a

  2. day 2 常用快捷键

    tab命令或路径补全**,linux里最有用的快捷键,如果tab不到路径或命令,就代表没有这个路径或者命令,还有可能是权限不对. ctrl+c :终止当前任务命令或程序. ctrl+d 退出当前用户环 ...

  3. 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文件 解 ...

  4. 利用NuSoap开发WebService(PHP)

    利用NuSoap开发WebService(PHP) 分类: php 2010-09-08 12:00 5005人阅读 评论(1) 收藏 举报 webservicephpsoapstringencodi ...

  5. MMORPG大型游戏设计与开发(客户端架构 part2 of vgui)

    这一节我将讲解vgui的基础系统部分,也是该库提供给外部使用的一些重要接口.作为UI部分比较重要的部分,该节有着至关重要的部分,如果没有看到上一节内容,请留意下面的连接.我们现在可以猜想一下在客户端U ...

  6. sobel算子原理及opencv源码实现

    sobel算子原理及opencv源码实现 简要描述 sobel算子主要用于获得数字图像的一阶梯度,常见的应用和物理意义是边缘检测. 原理 算子使用两个33的矩阵(图1)算子使用两个33的矩阵(图1)去 ...

  7. 123——Appium Girls活动

    有感于Ruby Girls和Python Girls,在15年就想组织一次移动测试的妹子活动,框架选择Appium, 从15年夏天开始准备,申请Google的会议室,招募教练,开放报名,审核报名,到正 ...

  8. app微信支付(一) - 微信支付基本业务流程解析

    想必微信支付是现在很多朋友离不开的一个功能,不论是扫描支付还是公众号支付或者app端支付,基本的思路都是一样的,之前做过支付宝支付以及中国移动支付接口,这几天花时间讲讲微信支付吧 先看一下微信支付的时 ...

  9. android学习疑问汇兑

    一. anroid开发精要是提到. 1. 每一个android应用只有 16MB 的堆空间? 这个如何解释? 2. 服务组件没有运行在独立的进程或者线程中,而是与其他的android组件一样,运行主线 ...

  10. 1,字符是否为空,2,比较两个字符大小。String.Compare(String, String)。string.IsNullOrEmpty(string)

    1, String.Compare 方法 (String, String) 比较两个指定的 String 对象. 值 条件 小于零 strA 小于 strB. 零 strA 等于 strB. 大于零 ...