不用jquery等框架实现ajax无刷新登录
<script type="text/javascript">
window.onload = function () { document.getElementById("btn").onclick = function () { var username = document.getElementById("uname").value;
var password = document.getElementById("pwd").value;
var xmh = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xmh.open("post", "/Handler1.ashx?username=" + username + "&password=" + password, true);
xmh.onreadystatechange = function () {
if (xmh.readyState == 4) {
if (xmh.status == 200) {
//var x=eval('('+xmh.responseText+')');//把json字符串转换为json对象
//上下两种方法都行
var x = JSON.parse(xmh.responseText);//把json字符串转换为json对象
alert(x.status);
}
else {
alert("出错");
}
} };
xmh.send();
}
};
</script>
什么是 XMLHttpRequest 对象?
XMLHttpRequest 对象用于在后台与服务器交换数据。
XMLHttpRequest 对象是开发者的梦想,因为您能够:
- 在不重新加载页面的情况下更新网页
- 在页面已加载后从服务器请求数据
- 在页面已加载后从服务器接收数据
- 在后台向服务器发送数据
所有现代的浏览器都支持 XMLHttpRequest 对象。
在回调函数中处理服务器的响应
onreadystatechange就是回调函数(处理服务器的响应,根据状态码)
- 0:请求未初始化(还没有调用
open())。 - 1:请求已经建立,但是还没有发送(还没有调用
send())。 - 2:请求已发送,正在处理中(通常现在可以从响应中获取内容头)。
- 3:请求在处理中;通常响应中已有部分数据可用了,但是服务器还没有完成响应的生成。
- 4:响应已完成;您可以获取并使用服务器的响应了。
status这类状态代码表明服务器成功地接受了客户端请求(如果readystatus为4,这只是服务器端完成了响应,但是是否是正确的响应就不知道了)
200 - OK 一切正常,对GET和POST请求的应答文档跟在后面。
不用jquery等框架实现ajax无刷新登录的更多相关文章
- AJAX实现无刷新登录
最近学习了如何实现无刷新登录,大体的效果如下(界面比较丑,请自行忽略....): 点击登录按钮时弹出登录窗口,输入正确的用户名密码后点击登录则登录窗口关闭,状态改为当前用户名. 第一步: 首先弹出窗口 ...
- DWZ框架Ajax无刷新表单提交处理流程
DWZ框架Ajax无刷新表单提交处理流程是: 1. ajax表单提交给服务器 2. 服务器返回一个固定格式json结构 3. js会调函数根据这个json数据做相应 ...
- Thinkphp框架 -- ajax无刷新上传图片
用Thinkphp框架做无刷新上传图片 视图层 View <!doctype html> <html lang="en"> <head> < ...
- jQuery Ajax无刷新操作
下面是“无刷新登录”的例子,采用Ashx+jQuery Ajax实现. //后台实例代码 ashx文件(可替换为从数据库中读取) public void ProcessRequest(HttpCont ...
- JQUERY AJAX无刷新异步上传文件
AJAX无刷新上传文件并显示 http://blog.csdn.net/gao3705512/article/details/9330637?utm_source=tuicool jQuery For ...
- jQuery实现form表单基于ajax无刷新提交方法详解
本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...
- thinkphp下实现ajax无刷新分页
1.前言 作为一名php程序员,我们开发网站主要就是为了客户从客户端进行体验,在这里,thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...
- Ajax.BeginForm()实现ajax无刷新提交
1. 同时安装 Microsoft jQuery Unobtrusive ajax 和 jQuery Unobtrusive Ajax,如下图 安装完成之后多了如下的js库 2. 引用该js库 lay ...
- thinkphp ajax 无刷新分页效果的实现
思路:先做出传统分页效果,然后重新复制一份Page.class.php类,对它进行修改,把js中的函数传到page类中,把上一页.下一页.首页.尾页.链接页中的url地址改成js控制的函数,模板页面中 ...
随机推荐
- pkg-config相关的常用指令
pkg-config用途: 查询系统已安装库的基础信息(元信息) 1.查看所有的pkg-config库 pkg-config --list-all --list-all 列出pkg-config路径 ...
- nutch,hbase,zookeeper兼容性问题
nutch-2.1使用gora-0.2.1, gora-0.2.1使用hbase-0.90.4,hbase-0.90.4和hadoop-1.1.1不兼容,hbase-0.94.4和gora-0.2.1 ...
- BZOJ 3872 Ant colony
Description There is an entrance to the ant hill in every chamber with only one corridor leading int ...
- GIT,VAGRANT及COREOS
搞了COREOS才高大上啊. 测试DOCKER安装. 就是WIN下面GIT显得土豪..
- Beauty Contest(graham求凸包算法)
Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 25256 Accepted: 7756 Description Bess ...
- kafka在zookeeper中的存储结构
参考site:http://kafka.apache.org/documentation.html#impl_zookeeper 1.zookeeper客户端相关命令 在确保zookeeper服务启动 ...
- [LeetCode] 141&142 Linked List Cycle I & II
Problem: Given a linked list, determine if it has a cycle in it. Follow up:Can you solve it without ...
- JavaScript 函数绑定 Function.prototype.bind
ECMAScript Edition5 IE9+支持原生,作用为将一个对象的方法绑定到另一个对象上执行. Function.prototype.bind = Function.prototype.bi ...
- SRM 400(1-250pt, 1-500pt)
DIV1 250pt 题意:给定一个正整数n(n <= 10^18),如果n = p^q,其中p为质数,q > 1,则返回vector<int> ans = {p, q},否则 ...
- Jenkins 十二: 集成 selenium 测试
我的selenium采用的是python版本. 其实 selenium java版本也类似. 1. 在jenkins里面新建selenium 测试项目. 源码管理采用 “Subversion”,输入 ...