原生js提交表单
/********************* 表单提交 ***********************/
function ajax(options) {
options = options || {};
options.type = (options.type || "GET").toUpperCase();
options.dataType = options.dataType || "json";
var params = formatParams(options.data); //创建 - 非IE6 - 第一步
if (window.XMLHttpRequest) {
var xhr = new XMLHttpRequest();
} else { //IE6及其以下版本浏览器
var xhr = new ActiveXObject('Microsoft.XMLHTTP');
} //接收 - 第三步
xhr.onreadystatechange = function () {
if (xhr.readyState == ) {
var status = xhr.status;
if (status >= && status < ) {
options.success && options.success(xhr.responseText, xhr.responseXML);
} else {
options.fail && options.fail(status);
}
}
} //连接 和 发送 - 第二步
if (options.type == "GET") {
xhr.open("GET", options.url + "?" + params, true);
xhr.send(null);
} else if (options.type == "POST") {
xhr.open("POST", options.url, true);
//设置表单提交时的内容类型
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(params);
}
}
//格式化参数
function formatParams(formId) {
var form = document.getElementById(formId);
var tagElements = form.getElementsByTagName('input');
var arr = [];
for (var i = ; i < tagElements.length; i++) {
arr.push(encodeURIComponent(tagElements[i].name) + "=" + encodeURIComponent(tagElements[i].value));
}
arr.push(("v=" + Math.random()).replace(".", ""));
return arr.join("&");
}
/***************************** 结束小尾巴 ***********************************/
原生js提交表单的更多相关文章
- 利用JS提交表单的几种方法和验证(必看篇)
第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <scr ...
- web 界面设计---js提交表单
<script type="text/javascript"> function checkImage(){ var imageValue = document.get ...
- JS提交表单页面不跳转、JS下载、动态创建from
JS下载 function downloadFile(id) { var url = "<%=request.getContextPath()%>/cer/downlo ...
- 原生js制作表单验证,基本的表单验证方法
表单验证是web前端最常见的功能之一,也属于前端开发的基本功.自己完成一个表单验证的开发,也有助于加深对字符串处理和正则表达式的理解. 基本的表单验证包括如:字母验证.数字验证.字母和数字验证.汉字验 ...
- 利用JS提交表单的几种方法和验证
第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 <script type="text/javascript"> function ...
- 原生JS写表单验证提交功能
先上效果图: 表单的基础内容就是昵称判断.手机号判断.邮箱判断.身份证号码判断,这里是用到正则验证检验格式. 页面的表单写法就是一个form的提交.输入框用input来实现,输入内容用value来获取 ...
- 原生JS实现表单序列化serialize()
有一个form表单,要用AJAX后台提交,原来想拼接json,但是数据多了麻烦,不灵活. 用HTML5的FormData来初始化表单 var formdata=new FormData(documen ...
- js提交表单错误:document.form.submit() is not a function
今天在写JS时,遇上这么个错误:"document.form.submit() is not a function",经过一番搜索,最终找到了修复方法. 这个错误一般是由于表单&l ...
- 使用jquery.form.js提交表单上传文件
方法: 1.formSerilize() 用于序列化表单中的数据,并将其自动整理成适合AJAX异步请求的URL地址格式. 2.clearForm() 清除表单中所有输入值的内容. 3.restF ...
随机推荐
- atitit.为什么java体系开发效率这样低的原因and解决
atitit.为什么java体系开发效率这样低的原因and解决 #---开发理念问题(影响度:很大的,2-3倍效率) mvc<>webform server control ajax< ...
- SpringMVC 架构
SpringMVC 架构 1. 前言 SpringMVC是目前java世界中最为广泛应用的web框架,最然从学习SpringMVC的第一个程序--helloworld至今,已有好几个年头.其间伴随着项 ...
- 一个映射到mac风格按键的AHK脚本(替换虚拟机键盘映射)
Mac键位映射(部分) win+q 退出程序 win+w 关闭当前页面 win+h 隐藏当前窗口 win+shift+h 隐藏其他窗口 win+s 保存 win+o 打开 win+z 撤销 win+s ...
- java.lang.ClassNotFoundException: org.junit.Assume$AssumptionViolatedException
java.lang.ClassNotFoundException: org.junit.Assume$AssumptionViolatedException 在spring框架中进行单元测试,出现标题 ...
- Wireshark图解教程
Wireshark是世界上最流行的网络分析工具.这个强大的工具可以捕捉网络中的数据,并为用户提供关于网络和上层协议的各种信息.与很多其他网络工具一样,Wireshark也使用pcap network ...
- linux centos java 应用服务器配置
备忘: https://oneinstack.com/ 1.用root装jdk nginx.tomcat. 2.配置tomcat主机,上传应用.修改数据库连接帐号,修改log4j文件路径.3.安装my ...
- ELK——安装 logstash 2.2.0、elasticsearch 2.2.0 和 Kibana 3.0
本文内容 Elasticsearch logstash Kibana 参考资料 本文介绍安装 logstash 2.2.0 和 elasticsearch 2.2.0,操作系统环境版本是 CentOS ...
- 2013eoe移动开发者大会圆满落幕
(国内知名Android开发论坛.安卓开发社区推荐:http://www.eoeandroid.com/) 2013eoe移动开发者大会9月14号于国家会议中心盛大召开并圆满结束,超过2000个开发者 ...
- <[你在荒废时间的时候别人都在拼命!]>
如果我在这里退缩了,那么再也不可能前进 当人有了目标的时候,就会有拼命努力的动力. 当一个人真的掌握了一些东西的时候,才会觉得踏实,这就是所谓的内涵. 人生其实就是这样一步步走过去的.付出总有回报,回 ...
- android:layout_weight
layout_weight 用于给一个线性布局中的诸多视图的重要度赋值. 所有的视图都有一个layout_weight值,默认为零,意思是需要显示多大的视图就占据多大的屏幕空 间.若赋一个高于零的值, ...