原生态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 ...
随机推荐
- 使用SwipeListView实现滑动效果
QQ的滑动删除效果很不错,要实现这种效果,可以使用SwipeListView.1. 下载com.fortysevendeg.swipelistview这个项目(以前GitHub上有,现在GitHub上 ...
- android studio 1.0 开发 ndk 调用 c++ so库
一个没用过java和安卓的人使用android studio开发带c++ so库的安卓程序用例(以ndk的hello-jni为例),对于不熟悉java和安卓的人来说这个很花时间,希望通过这篇文章帮助跟 ...
- oracle函数大全(转载)
F.1字符函数--返回字符值 这些函数全都接收的是字符族类型的参数(CHR除外)并且返回字符值.除了特别说明的之外,这些函数大部分返回VARCHAR2类型的数值.字符函数的返回类型所受的限制和基本数据 ...
- 【来自媳妇的需求】PHP实现随机数和方程求解
话说2015.11.06 ,北京下了第一场雪.16年的今天没下雪,但是雾霾还是不小的,帮媳妇整理她工作时,出现了下面的需求,便想到使用PHP来写程序来进行求解. [需求] 1. 给出一个平均值X,反过 ...
- Tomcat启动报错整理
1.启动报 Connector attribute SSLCertificateFile must be defined when using SSL with APR conf\server.xml ...
- Hibernate @OneToMany等注解设置查询过滤条件等
1.如实体PdOrg对象中有users对象,数据库user表有字段DEL_FLAG(0:删除:1:未删除): private List<User> users= new ArrayList ...
- jQuery uploadify 文件上传
uploadify这个插件是基于js里面的jquery库写的.结合了ajax和flash,实现了这个多线程上传的功能.现在最新版为3.2.1. 在线实例 实例预览 Uploadify 在线实例Demo ...
- 【Spring】浅析Spring框架的搭建
c目录结构: // contents structure [-] Spring是什么 搭建Spring框架 简单Demo 1,建立User类 2,建立Test类 3,建立ApplicationCont ...
- 带节日和农历的js日历
带农历的脚本: http://keleyi.com/keleyi/phtml/jstexiao/11.htm http://keleyi.com/tools/rili/ <html> &l ...
- Vue.js 递归组件实现树形菜单
最近看了 Vue.js 的递归组件,实现了一个最基本的树形菜单. 项目结构: main.js 作为入口,很简单: import Vue from 'vue' Vue.config.debug = tr ...