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基本操作命令之文件查看cat more less tail head

    cat 参考之前博客:Linux基础命令之cat使用方法大全 more 命令 命令:more使用权限:所有使用者使用方式:more [选项] filename说明:类似于cat,不过会一页一页的显示内 ...

  2. 003.同时Ping多个IP(select实现IO复用,信号计时),ping程序升级版

    写这个的目的主要是为了以后的方便: 1.信号计时函数的使用 2.ip头的构建和icmp头的构建 3.selec函数t的用法 代码实现: /src/ping.h /* * ping.h * * Crea ...

  3. Arch Linux sudo: PAM authentication error: Module is unknown [Solved!]

    问题描述: 我的 Arch Linux 已经用了快半年多,由于 Arch Linux 的滚挂问题,我从没有直接升级过系统.软件版本以及库自然落后了一些. 就在我准备需要用到 NFS 时,挂载网络文件系 ...

  4. 免费股票数据API接口

    免费股票数据API接口提供沪深.香港.美国股市信息. 1.沪深股市 2.香港股市 3.美国股市 4.香港股市列表 5.美国股市列表 6.深圳股市列表 7.沪股列表 API文档:https://www. ...

  5. java报表工具finereport常用函数的用法总结(数组函数)

    ADD2ARRAY ADDARRAY(array,insertArray, start):在数组第start个位置插入insertArray中的所有元素,再返回该数组. 示例: ADDARRAY([3 ...

  6. C++/C#互调步骤

    一.C#调用C++ dll步骤(只能导出方法):  * 1. c++建立空项目->源文件文件夹中添加cpp文件和函数  * 2. c++属性设置中,配置类型设置为动态库dll,公共语言运行时支持 ...

  7. 如何通过JQuery将DIV的滚动条滚动到指定的位置

    这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置,方便自动定位. var container = $('div'), inner = $('#inner'); container.scrol ...

  8. AC日记——最长最短单词 openjudge 1.7 25

    25:最长最短单词 总时间限制:  1000ms 内存限制:  65536kB 描述 输入1行句子(不多于200个单词,每个单词长度不超过100),只包含字母.空格和逗号.单词由至少一个连续的字母构成 ...

  9. SQL——查询考试

    一.            设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher).四个表的结构分别如表1-1的表(一)~表( ...

  10. TestLink学习二:Windows搭建TestLink环境

    环境准备: 搭建php5.4.39+apache2.2+mysq5.5.28l环境 (可参考http://www.cnblogs.com/yangxia-test/p/4414161.html) (注 ...