<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无刷新登录的更多相关文章

  1. AJAX实现无刷新登录

    最近学习了如何实现无刷新登录,大体的效果如下(界面比较丑,请自行忽略....): 点击登录按钮时弹出登录窗口,输入正确的用户名密码后点击登录则登录窗口关闭,状态改为当前用户名. 第一步: 首先弹出窗口 ...

  2. DWZ框架Ajax无刷新表单提交处理流程

    DWZ框架Ajax无刷新表单提交处理流程是: 1.       ajax表单提交给服务器 2.       服务器返回一个固定格式json结构 3.       js会调函数根据这个json数据做相应 ...

  3. Thinkphp框架 -- ajax无刷新上传图片

    用Thinkphp框架做无刷新上传图片 视图层 View <!doctype html> <html lang="en"> <head> < ...

  4. jQuery Ajax无刷新操作

    下面是“无刷新登录”的例子,采用Ashx+jQuery Ajax实现. //后台实例代码 ashx文件(可替换为从数据库中读取) public void ProcessRequest(HttpCont ...

  5. JQUERY AJAX无刷新异步上传文件

    AJAX无刷新上传文件并显示 http://blog.csdn.net/gao3705512/article/details/9330637?utm_source=tuicool jQuery For ...

  6. jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...

  7. thinkphp下实现ajax无刷新分页

    1.前言 作为一名php程序员,我们开发网站主要就是为了客户从客户端进行体验,在这里,thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...

  8. Ajax.BeginForm()实现ajax无刷新提交

    1. 同时安装 Microsoft jQuery Unobtrusive ajax 和 jQuery Unobtrusive Ajax,如下图 安装完成之后多了如下的js库 2. 引用该js库 lay ...

  9. thinkphp ajax 无刷新分页效果的实现

    思路:先做出传统分页效果,然后重新复制一份Page.class.php类,对它进行修改,把js中的函数传到page类中,把上一页.下一页.首页.尾页.链接页中的url地址改成js控制的函数,模板页面中 ...

随机推荐

  1. BAE 环境下 hibernate annotations 配置

     annotations 配置 首先需要加入 hibernate-jpa-2.0-api-1.0.1.Final.jar 和 ejb3-persistence.jar 这两个包 ejb3-persis ...

  2. ASP.NET MVC轻教程 Step By Step 3 ——使用ViewBag

    在上一节我们创建了与Index动作方法对应的Index视图,那么Index动作方法该如何向Index视图传送数据呢?其中一个方法是使用ViewBag(视图包).让我们试试看. 在Index动作方法中添 ...

  3. DotNet 资源

    DotNet 资源 目录 API 应用框架(Application Frameworks) 应用模板(Application Templates) 人工智能(Artificial Intelligen ...

  4. Google为何这么屌

    概述: 在移动市场上,从来没有一个公司像Google一样的玩法,以后可能也不会有.因为这根本就不是一个商业模式.它可以调动极大的资源而几乎没有盈利压力,它力逾千钧又身段灵活.它从来不尊重这个市场原有的 ...

  5. angular2 学习笔记 (Pipes)

    Pipe 就是 ng1 的 filter <pre>{{ jsonValue | json }}</pre> 用法看这里就很清楚了 : https://angular.cn/d ...

  6. C++ STL的各种实现版本

    ANSI/ISO的C++ STL规范版本正式通过以后,各个C++编译器厂商就可以依照标准所描述的原型去实现C++ STL泛型库,于是出现多种符合标准接口,但具体实现代码不同的泛型库,主要有: HP S ...

  7. FFmpeg常用基本命令

    FFmpeg常用基本命令 1.分离视频音频流 ffmpeg -i input_file -vcodec copy -an output_file_video //分离视频流 ffmpeg -i inp ...

  8. COJ 0967 WZJ的数据结构(负三十三)

    WZJ的数据结构(负三十三) 难度级别:E: 运行时间限制:7000ms: 运行空间限制:262144KB: 代码长度限制:2000000B 试题描述 请你设计一个数据结构,完成以下功能: 给定一个大 ...

  9. Linux 多线程调试(内存占用、死循环、CPU占用率高……)

    文章出处:http://www.cnblogs.com/cy568searchx/archive/2013/10/28/3391790.html 你的软件在某个时刻停止服务,CPU占用达到100%+, ...

  10. 【模拟】NCPC 2014 D Dice Game

    题目链接: http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1790 题目大意: 两个人,每个人有两个骰子,每个骰子可以等概率取[a,b],问哪个人两 ...