原生态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 ...
随机推荐
- thinkphp配置文件路径
thinkphp配置文件路径在入口文件index.php中配置. 如果Public目录在应用程序目录同等级位置: 2.如果Public在app内部则: 3.如果使用Public在app外部,但定义为: ...
- 从零开始学 Java - Spring MVC 统一异常处理
看到 Exception 这个单词都心慌 如果有一天你发现好久没有看到Exception这个单词了,那你会不会想念她?我是不会的.她如女孩一样的令人心动又心慌,又或者你已经练功到了孤独求败,等了半辈子 ...
- Linux Ctrl+c与ctrl+z的区别
提问:CTRL-Z和CTRL-C区别?回答:CTRL-Z和CTRL-C都是中断命令,但是他们的作用却不一样.CTRL-C是强制中断程序的执行,而CTRL-Z的是将任务中断,但是此任务并没有结束,他仍然 ...
- ASP.NET MVC开发中常见异常及解决方案
ASP.NET MVC4入门到精通系列目录汇总 NHibernate:no persister for 异常 1.配置文件后缀名写错 mapping file 必须是.hbm.xml结尾 2.Web. ...
- LZW压缩算法——简明原理与实现
LZW和哈夫曼编码一样,是无损压缩中的一种.该算法通过建立字典,实现字符重用与编码,适用于source中重复率很高的文本压缩.本文首先讲下LZW的编解码原理,然后给出LZW的实现code. ***** ...
- 新建 ASP.NET Core MVC 项目 -- Hello World!
一.创建一个空项目 请查看 新建 .NET Core 项目 -- Hello World! 一节,新建一个项目: 二.添加引用并修改配置为 MVC 修改 .vscode\launch.json 文件 ...
- javascript组合继承
javascript继承有几种继承方式,现在来说说其中的组合继承. 组合继承是结合了原型链和借用构造函数这两种技术的继承方式,分别利用它们的长处,避免了短处.那就先说说这两种技术吧. 原型链 原型链 ...
- 公司内部的一篇关于dom方法的分享
第一部分 dom node类型 nodeType 属性 nodeType 属性返回节点的类型.nodeType 是只读的. 比较重要的节点类型有: 元素类型 NodeType 元素 1 属性 2 文本 ...
- ListView控件
打气筒工具:将R.layout.item_listview布局添加到相应的view控件里面 View view=LayoutInflater.from(ScondPro.this).inflate ...
- active_record的不定时更新
1 valid?方法只是校验所有的校验条件,如果规则A仅加在数据库上,而不是model上,是不对校验起作用的,最后提交时虽然校验成功,但仍然会抛异常.比如数据库中增加了非空的规则,但模型上没有pres ...