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 ...
随机推荐
- parted在2T以上硬盘上分区操作
parted分区生产环境如何使用? 1)pertend一般用于当硬盘(raid后)大于2t的时候分区操作,2t以下还是用fdisk分区 2)使用parted一般操作系统都已经安装好了 3)大于2t的因 ...
- linux 进程管理相关内容
简介 当我们运行程序时,Linux会为程序创建一个特殊的环境,该环境包含程序运行需要的所有资源,以保证程序能够独立运行,不受其他程序的干扰.这个特殊的环境就称为进程. 每个 Linux 命令都与系统中 ...
- golang和vim-go安装配置
一.Golang安装 1.下载golang安装包http://golangtc.com/download,我这里下载的是go1.6rc2.linux-amd64.tar.gz. 2.解压到安装目录,我 ...
- linux下 ^M
在Linux下使用vi来查看一些在Windows下创建的文本文件,有时会发现在行尾有一些“^M”.有几种方法可以处理. 注意:在Linux下,可以通过ctrl+v,ctrl+m,打出^M字符.而却,以 ...
- 关于C语言中的位域
有些信息在存储时,并不需要占用一个完整的字节, 而只需占几个或一个二进制位.例如在存放一个开关量时,只有0和1 两种状态,用一位二进位即可.为了节省存储空间,并使处理简便,C语言提供了一种数据结构,称 ...
- C++浅析——继承类内存分布和虚析构函数
继承类研究 1. Code 1.1 Cbase, CTEST为基类,CTest2为其继承类,并重新申明了基类中的同名变量 class CBase { public: int Data; CBase() ...
- C#基础----Linq之List<T>篇
最近有用到List处理排序以及分页的问题.想想还是写一个博客记录一下.以下围绕Person类实现,Person类只有Name和Age两个属性 一.List<T>排序 1.1 List& ...
- 使用IntelliJ IDEA 编译开源的机器学习源码--Oryx
What is Oryx? 大名鼎鼎的Sean Owen (http://www.linkedin.com/in/srowen) 正在 Cloudera 作为 Director of Data Sci ...
- VS设置程序集属性(文件的详细信息)
适用范围 本文方法适用于:C#创建的控制台程序,WinForm,WPF等VS创建的.Net工程信息设置. 方法步骤 1.在 项目 上点击鼠标右键选择 属性 ,进入这个页面,点击 程序集信息(重点关注 ...
- u3d_shader_surface_shader_3
参考http://my.oschina.net/u/138823/blog/181131 加了个凹凸贴图: 抱歉把女神苏菲做成这样. 一:Normal Texture的制作: 1.首先是Normal ...