编写javascript(Ajax)实现登录

var  xmlhttp;

if (window.XMLHttpRequest){    //IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=newXMLHttpRequest();

} else {// IE6, IE5

xmlhttp=newActiveXObject("Microsoft.XMLHTTP");

}

//上面的http请求对象的生成做了一个浏览器兼容性处理

var adminName = document.getElementById('adminName').value;

//获取html表单中adminName输入域对象的值,既账号

var  psw = document.getElementById('psw').value;

//获取html表单中pwd输入域对象的值,既密码

xmlhttp.onreadystatechange=function(){

//当接受到响应时回调该方法

if(xmlhttp.readyState==4&& (xmlhttp.status==200||xmlhttp.status==0)){

var tip = document.getElementById('tip');

//获取html的tip节点,主要用于输出登录结果

var text = xmlhttp.responseText;

//使用接口返回内容,响应内容

var  resultJson =eval("("+text+")");//把响应内容对象转成javascript对象

var  result = resultJson.result;

//获取json中的result键对应的值

var code = resultJson.code;

//获取json中的code键对应的值

if(result=="fail") {

//登录失败

if(code==101){

tip.innerHTML ="密码错误!"}elseif(code==102){

tip.innerHTML ="用户不存在!"}

}else//登录成功        if(result=="success"&&code==100)

{

window.location.href="center.html";//跳转到centent.html页面}

}

}

xmlhttp.open("POST","control1/login",true);//以POST方式请求该接口xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

//添加Content-type

xmlhttp.send("adminName="+adminName+"&psw="+psw);//发送请求参数间用&分割

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 单例模式 适用场景:可能会在场景中使用到对象,但只有一个实例,加载时并不主动创建,需要时才创建 最常见的单例模式,...
    Obeing阅读 2,142评论 1 10
  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 7,964评论 2 17
  • 属于简易版,比较适合没有后台基础的初学者入门,使用Ajax响应php对mysql数据库进行操作,将网站搭建在xam...
    dovlie阅读 987评论 0 5
  • 《ijs》速成开发手册3.0 官方用户交流:iApp开发交流(1) 239547050iApp开发交流(2) 10...
    叶染柒丶阅读 5,429评论 0 7
  • 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放...
    孤魂草阅读 942评论 0 0