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 ...
随机推荐
- js中json对象和字符串的转换
JSON.parse() : 字符串-->json对象 var str = '{"name":"huangxiaojian","age" ...
- [书目20160624]Android应用开发从入门到精通
卢海东 著 第1章 揭开神秘面纱——Android系统简介 1 1.1 认识Android系统 2 1.1.1 Android成长历程 2 1.1.2 发行版本 3 1.1.3 得到大 ...
- [转]MVC3缓存之一:使用页面缓存
本文转自:http://www.cnblogs.com/parry/archive/2011/03/19/OutputCache_In_MVC3.html 在以前的WebForm的开发中,在页面的头部 ...
- 连载《一个程序猿的生命周期》-6、自学C++,二级考过后,为工作的机会打下了基础
一个程序猿的生命周期 微信平台 口 号:职业交流,职业规划:面对现实,用心去交流.感悟. 公众号:iterlifetime 百木-ITer职业交流奋斗 群:141588103 微 博:h ...
- CodeForces 466E Information Graph --树形转线性+并查集
题意:有三种操作: 1.新增一条边从y连向x,此前x没有父节点 2.x接到一份文件,(文件标号逐次递增),然后将这份文件一路上溯,让所有上溯的节点都接到这份文件 3.查询某个节点x是否接到过文件F 解 ...
- 使用gulp将移动端px转为rem
使用gulp的插件可以很方便的将xp转为rem,在布局的时候使用@1x .@2x布局,即10rem=device-width:@1x即设计图为320px,1rem对应的10px像素,相对的@2x即为布 ...
- grunt-contrib-uglify压缩插件的常用配置属性
mangle:false(不混淆变量名和方法名,保留原有的名字),如果不配置,默认混淆,就是将所有方法名和变量都用a,b,c等字母替换 preserveComments : 'all'(不删除注释,还 ...
- HTML 学习笔记 CSS3 (文本效果)
text-shadow 语法 text-shadow : none | <length> none | [<shadow>, ] * <shadow> 或none ...
- HTML 学习笔记 CSS(选择器3)
CSS 属性选择器 属性选择器可以根据元素的额属性以及属性值来选择元素 例子1 如果 你希望把包含title的所有元素变成红色 *[title] {color:red} 例子2 与上面类似 可以只对有 ...
- HOJ 2713 Matrix1
Matrix1 My Tags (Edit) Source : Classical Problem Time limit : 5 sec Memory limit : 64 M Sub ...