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. ICTCLAS中文分词库的使用

    ICTCLAS计算所中文分词(当前最好的汉语词法分析器)系统特点:准确度高(98.5%),性能优越(500KB/s分词速度),词性标注(POS tagging)且支持多种标注集,支持用户自定义词典,支 ...

  2. Android View和ViewGroup

    View和ViewGroup Android的UI界面都是由View和ViewGroup及其派生类组合而成的. 其中,View是所有UI组件的基类,而 ViewGroup是容纳这些组件的容器,其本身也 ...

  3. webdriver的工作原理

    selenium1的原理就是使用js来驱动浏览器,因为现在基本不用,所以不做过多讨论,下面是我整理的webdriver的工作原理,大致就是通过命令请求webdriver,然后webdriver通过浏览 ...

  4. 第65课 C++中的异常处理(下)

    1. C++中的异常处理 (1)catch语句块可以抛出异常 ①catch中获捕的异常可以被重新抛出 ②抛出的异常需要外层的try-catch块来捕获 ③catch(…)块中抛异常的方法是throw; ...

  5. Treap入门(转自NOCOW)

    Treap 来自NOCOW Treap,就是有另一个随机数满足堆的性质的二叉搜索树,其结构相当于以随机顺序插入的二叉搜索树.其基本操作的期望复杂度为O(log n). 其特点是实现简单,效率高于伸展树 ...

  6. 如何查看文件是dos格式还是unix格式的?

    一.背景 由于windows和linux对换行的标识不一样,不同系统的代码传递导致代码格式的改变中可能会带来程序无法正常编译通过的问题.因此根据一些编译的错误提示,可以定位到是文件格式的问题,要对程序 ...

  7. Visual Studio各版本工程文件之间的转换

    转载于:http://www.cnblogs.com/jmliao/p/5594179.html 由于VS版本比较多,低版本无法直接打开高版本的工程文件,通过对工程文件进行一些修改可以解决这些问题. ...

  8. sql server 修改表结构语法大全

    1.增加字段 ) 2.删除字段 alter table table_name drop column column_name 3.修改字段类型 alter table table_name alter ...

  9. webpack常用插件

    extract-text-wepback-plugin 该插件用于把css代码从页面中抽离出来,以link的形式从外部加载 html-webpack-plugin 可以自动快速地生成html文件

  10. (原创)mybatis学习四,利用mybatis自动创建代码

    在使用mybatis的过程中,我们可以直接利用MyBatis生成器自动生成实体类.DAO接口和Mapping映射文件,然后copy到工程中即可 需要的jar包如下 下载路径如下:下载jar包 其中的g ...