原生态ajax
用户名是否被注册过?
创建出注册信息:
<h1>注册信息</h1>
<input type="text" name="txtName" id="txtName"/> <span id="msg"></span><br/>
<input type="password" name="txtPwd"/>
//创建myajx
function myajax(){
//01.定制出 xhr对象
var xhr;
//02.能力检测
if(window.XMLHttpRequest){
//非IE浏览器
xhr=new XMLHttpRequest();
}else{
//IE内核
xhr=new ActiveXObject("Microsoft.XMLHttp");
}
var dom=document.getElementById("txtName");
var myspan=document.getElementById("msg");
var myval=dom.value;
//03.构建请求地址
//xhr.open("请求类型","请求地址","是否异步");
xhr.open("get","<%=path%>/servlet/CheckUserServlet?uname="+myval,true);
//04.设置回调函数 响应回来的数据
xhr.onreadystatechange=function(){
//什么
if(xhr.readyState==4&&xhr.status==200){
//获取响应数据
var data=xhr.responseText;
if(data=='OK'){
myspan.innerText="用户名已经被注册";
}else{
myspan.innerText="用户名可以注册";
}
}
};
//05.用send真正的发送请求
xhr.send(null);
}
//用js的方式锁定焦点,并且失去焦点的时候执行myajax
window.onload=function(){
var dom=document.getElementById("txtName");
dom.onblur=function(){
myajax();
};
};
//ajax访问的servlet 内容
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String name =request.getParameter("uname");
if(name.equals("admin")){
response.getWriter().write("OK");
}else{
response.getWriter().write("NO");
}
}
原生态ajax的更多相关文章
- 向后台提交数据:通过form表单提交数据需刷新网页 但通过Ajax提交数据不用刷新网页可通过原生态Ajax或jqueryAjax。Ajax代码部分
原生态Ajax提交表单:需要借助XMLHttpRequest对象的open,要收通过post发送请求还要setRequsetHeader,然后把数据发送给后端,代码如下 目录结构 index.py代码 ...
- 原生态AJAX详解和jquery对AJAX的封装
AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...
- 原生态ajax 传递json参数到服务器端
案例说明:通过ajax将用户名和密码以json形式传递给服务器端,然后服务器端接受数据,进行处理返回json数据到前端 首先,在客户端,通过JavaScript脚本将页面表单数据封装成JSON格式.L ...
- 原生态Ajax实例
<script type="text/javascript"> var xmlhttprequest; function GetXmlHttpRequest() { i ...
- Ajax从服务器端获取数据---原生态Ajax
写在前面的话 Ajax从服务器获取的数据都是字符串,但是通过不同的解析,可以解析为XML或JSON来进行应用. 一般来说.使用XML格式的数据比较通用,但是服务器和客户端解析起来都比较复杂一些;而使用 ...
- AJAX 原生态
AJAX 原生态 原生态AJAX详解和jquery对AJAX的封装 A ...
- Ajax—web中ajax的常用方式
什么Web2.0的特点? 1:注重用户贡献度 2:内容聚合RSS协议(每小块都个性化,单独加载单独请求,不用全部刷新--Ajax) 3:更丰富的用户体验 Ajax的概念? "Asynchro ...
- ajax异步上传图片三种方案
转自:http://www.jb51.net/article/51180.htm 注:自己尝试了前两种,都可用: 目前常用的异步文件上传功能有几种,比较多见的如使用iframe框架形式,ajax功能效 ...
- Java面试宝典(2018版)
置顶 2018年11月10日 23:49:18 我要取一个响亮的昵称 阅读数:8893 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/chen ...
随机推荐
- 【转】mysql_fetch_row , mysql_fetch_array , mysql_fetch_assoc 的区别
<?php $link = mysql_connect('localhost', 'root', ”); mysql_select_db('abc', $link); $sql = “selec ...
- ahjesus web动态icon
刚刚逛插件无意间发现的,记录下,里面有demo可以直接run了看效果 http://nicolasbize.com/faviconx/ http://www.miaofree.com/
- SSH整合之全注解
SSH整合之全注解 使用注解配置,需要我们额外引入以下jar包
- css之水平居中设置
行内元素: div,p{text-align:center;} 定宽块状元素: 第一宽度固定,第二margin-left和margin-right均是auto.div{border:1px ...
- 【grunt第三弹】grunt在前端实际项目中的应用
前言 [grunt第二弹]30分钟学会使用grunt打包前端代码(02) [grunt第一弹]30分钟学会使用grunt打包前端代码 经过前两次的学习,我们了解了grunt打包的一些基础知识,对于压缩 ...
- 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(六)地图搜索模块
config.xml文件的配置如下: <widget label="地图搜索" icon="assets/images/emergency_resource_ove ...
- C# Stream 和 byte[] 之间的转换
一. 二进制转换成图片 MemoryStream ms = new MemoryStream(bytes); ms.Position = ; Image img = Image.FromStream( ...
- sp_executesql得到执行sql语句的返回值
执行 sql语句,得到 变量的值 ' declare @Partition int; ); ); SET @SQLString = N'SELECT @RangeKeyOUT = $PARTITION ...
- CentOS 6.6安装Xtrabackup RPM提示缺少libev.so.4()
在CentOS Release 6.6安装percona-xtrabackup-2.3.4时,遇到下面错误信息 rpm -ivh percona-xtrabackup-2.3.4-1.el6.x86_ ...
- Linux命令学习总结:pwd命令
命令简介: 该命令用来显示目前所在的工作目录.指令英文原义:print work directory 执行权限 :All User 指令所在路径:/usr/bin/pwd 或 /bin/pwd ...