ajax登录验证-js
1、html代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ajax登录</title>
</head>
<body>
<div>
<form action="" method="post">
<div id="showinfo"></div>
用户名：<input type="text" name="username" id="username"/>
<br />
密码：<input type="password" name="password" id="password"/>
<input type="button" id="btn" value="登录"/>
</form>
</div>
<script type="text/javascript">
window.onload = function(){
var btn = document.getElementById("btn");
btn.onclick = function(){ var username = document.getElementById("username").value;
var passwords = document.getElementById("password").value var xhr = null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();
}else{
xhr = ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open('get','./check.php?username='+username+"&password="+passwords,true);
xhr.onreadystatechange = function(){
if(xhr.readyState==4){
if(xhr.status==200){
var data = xhr.responseText;
if(data==1){
document.getElementById('showinfo').innerHTML = "用户名或密码错误"
}else if(data==2){
document.getElementById('showinfo').innerHTML = "登录成功" }
}
}
}
xhr.send(null);
}
}
</script>
</body>
</html>
2、后台代码（此处是php）
<?php
$username = $_GET['username'];
$password = $_GET['password']; if($username=='admin' && $password=='123'){
echo 2;
}else{
echo 1;
}
?>
3、实现结果展示
ajax登录验证-js的更多相关文章
- 使用ajax登录验证，第一次点击登录按钮无反应，第二次点击才能正常运行。
问题描述: 使用ajax进行登录验证时,第一次点击登录按钮无反应,第二次点击才能进去. 解决方法: 原来的代码 <form action="" method="po ...
- 完整的 dataType=text/plain jquery ajax 登录验证
Html: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <m ...
- Ajax注册验证js代码
分享jquery网站:http://www.css88.com/jqapi-1.9/focusout/ $(document).ready(function() { var bool_user = f ...
- 01- ajax， 登录验证，json数据，文件上传
1.ajax简介 1.向服务器发送请求的途径 # 向服务器发送请求的途径 1. 浏览器地址栏,默认get请求 2. form表单: get请求 post请求 3. a标签,默认get请求 4. Aja ...
- Python Django缓存，信号，序列化，文件上传，Ajax登录和csrf_token验证
本节内容 models操作 Django的缓存 请求方式 序列化 Form 配合Ajax实现登录认证 上传文件 Ajax csrf_token验证方式 1 models操作 单表查询: curd(增 ...
- Django 博客项目01 数据库设计与验证码校验+Ajax登录
数据库设计 from django.db import models from django.contrib.auth.models import AbstractUser class UserInf ...
- 2-功能1：基于用户认证组件和Ajax实现登录验证(图片验证码)
1.登录页面的设计 (1)label标签的id属性 label标签的id属性,点击label标记,相当于点击了input框 bootstarp样式 class="form-group&quo ...
- 基于Ajax与用户认证系统的登录验证
一.登录页面 from django.contrib import admin from django.urls import path from blog import views urlpatte ...
- Ajax（简介、基础操作、计算器，登录验证）
Ajax简介 Ajax 即"Asynchronous Javascript And XML"(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术. ...
随机推荐
- python的内置模块xml模块方法 xml解析 详解以及使用
一.XML介绍 xml是实现不同语言或程序直接进行数据交换的协议,跟json差不多,单json使用起来更简单,不过现在还有很多传统公司的接口主要还是xml xml跟html都属于是标签语言 我们主要学 ...
- busybox(三)最小根文件系统
目录 busybox(三)最小根文件系统 引入 构建终端 构造inittab 配置应用程序 构建C库 制作映像文件yaffs title: busybox(三)最小根文件系统 tag: arm dat ...
- Vue基础之es6
什么是ECMAScript,以及es6的诞生? 1997年 ECMAScript 1.0 诞生 1999年12月 ECMAScript 3.0诞生,它 是一个巨大的成功,在业界得到了广泛的支持,它奠定 ...
- Jenkins-在windows上安装及其部署
Jenkins是一个开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个开放易用的软件平台,使软件的持续集成变成可能.其主要功能:1.持续的软件版本发布/测试项目. ...
- NOI-OJ 1.13 ID:5 素数回文数的个数
整体思路 使用埃拉拖色尼算法提前计算出1000以内的素数表. 设计一个回文判断函数isHW(int n),难点在于数字回文的判断.一个简单的方法是将数字n使用sprintf输出在一个数组中,然后从数组 ...
- ElasticSearch评分分析 explian 解释和一些查询理解
ElasticSearch评分分析 explian 解释和一些查询理解 按照es-ik分析器安装了ik分词器.创建索引:PUT /index_ik_test.索引包含2个字段:content和nick ...
- [再寄小读者之数学篇](2014-06-22 函数恒为零的一个充分条件 [中国科学技术大学2011年高等数学B考研试题])
设 $f(x)$ 在 $\bbR$ 上连续, 又 $$\bex \phi(x)=f(x)\int_0^x f(t)\rd t \eex$$ 单调递减. 证明: $f\equiv 0$. 证明: 设 $ ...
- H5——弹性盒
[flex 弹性盒布局] * 1.给父容器添加display:flex/inline-flex;属性 * 2.父容器可以使用的属性值有: * ① flex-direction 属性决定主轴的方向(即项 ...
- Highcharts开发图表
1.折线图 显示一个静态的折线图,显示如下数据 星期 温度 周一 9~14 周二 4~10 周三 1~7 周四 4~9 周五 5~11 周六 8~13 周天 7~10 新建demo1.html < ...
- 401AM 随笔~ 322~330 的总结
web简介:html:超文本标记语言css:层叠样式表 或者css样式JavaScript:一门脚本语言前端:html css javascript<!---->:注释段落与文字p.b加粗 ...