Ajax技术使用
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style type="text/css">
<!--
#toolTip{
position: absolute;
left: 311px;
top: 39px;
width: 98px;
height: 48px;
padding-top: 45px;
padding-left: 25px;
padding-right: 25px;
z-index: 1;
display: none;
color: red;
background-image: url(images/tooltip.jpg);
}
-->
</style>
</head>
<body>
<form action="" method="post" name="form1">
用户名：<input name="username" type="text" id="username" size="32">
<img src="data:images/checkBt.jpg" width="104" height="23" style="cursor: hand;" onclick="checkUser(form1.username);"><br><br>
密 码：<input name="password1" type="text" id="password1" size="35" onclick="checkUser(form1.username);"><br><br>
确认密码:<input name="passowrd2" type="text" id="password2" size="35"><br><br>
E-mail :<input name="email" type="text" id="email" size="35">
<input type="image" name="imageField" src="data:images/registerBt.jpg">
</form>
<div id="toolTip"></div>
</body>
</html>
<script language="javascript">
function createRequest(url) {
http_request = false;
if (window.XMLHttpRequest) { // 非IE浏览器
http_request = new XMLHttpRequest(); //创建XMLHttpRequest对象
} else if (window.ActiveXObject) { // IE浏览器
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP"); //创建XMLHttpRequest对象
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP"); //创建XMLHttpRequest对象
} catch (e) {}
}
}
if (!http_request) {
alert("不能创建XMLHttpRequest对象实例！");
return false;
}
http_request.onreadystatechange = getResult; //调用返回结果处理函数
http_request.open('GET', url, true); //创建与服务器的连接
http_request.send(null); //向服务器发送请求
}
function getResult() {
if (http_request.readyState == 4) { // 判断请求状态
if (http_request.status == 200) { // 请求成功，开始处理返回结果
document.getElementById("toolTip").innerHTML=http_request.responseText; //设置提示内容
document.getElementById("toolTip").style.display="block"; //显示提示框
} else { // 请求页面有错误
alert("您所请求的页面有错误！");
}
}
}
function checkUser(userName){
if(userName.value==""){
alert("请输入用户名！");userName.focus();return;
}else{
createRequest('checkUser.jsp?user='+userName.value);
}
}
</script>
<%@page import="java.util.Arrays"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
String[] userList={"123456","111111"};
String user = new String(request.getParameter("user").getBytes("ISO-8859-1"),"UTF-8");
Arrays.sort(userList);
int result = Arrays.binarySearch(userList, user);
if(result>-1){
out.println("很抱歉，该用户名已经被注册！");
}else{
out.println("恭喜您，该用户名没有被注册！");
}
%>
</body>
</html>
Ajax技术使用的更多相关文章
- 使用ajax技术实现txt弹出在页面上
使用ajax技术实现txt弹出在页面上 使用ajax技术实现点击按钮,将TXT文本里的内容通过弹出框显示到页面上 /*事件会在页面加载完成后触发.*/ <script> window. ...
- 《所用到的AJAX技术基础》
来自百度网页,w3cshool网页:AJAX = Asychronous JavaScript and XML,翻译成中文为:异步的JavaScript XML. 异步的意思就是不重新加载整个页面,后 ...
- Ajax技术
1.ajax技术的背景 不可否认,ajax技术的流行得益于google的大力推广,正是由于google earth.google suggest以及gmail等对ajax技术的广泛应用,催生了ajax ...
- Ajax技术详解
Ajax技术:Ajax描述了一种主要使用脚本(JS)操纵HTTP的web应用架构,它的主要特点是使用脚本操纵HTTP和web服务器进行数据交换,不会导致页面重载.Ajax的核心是JS的XMLHttpR ...
- Java之Ajax技术
ajax(asynchronouse javascript and xml) 异步的javascript 和 xml(现在常把xml换成json): ajax是2005年提出的,在2006,2007年 ...
- 在 PHP 中结合 Ajax 技术进行图片上传
前面几则日志中讲述了在 PHP 中上传文件,相信大家对 PHP 中如何进行文件上传已经初步掌握.本文来继续探讨在 PHP 中上传文件的技术,不同的是,本次上传将仅限于图片文件的上传,并且将采用 Aja ...
- ajax 技术和原理分析
ajax所包含的技术 大家都知道ajax并非一种新的技术,而是几种原有技术的结合体.它由下列技术组合而成. 1.使用CSS和XHTML来表示. 2. 使用DOM模型来交互和动态显示. 3.使用XMLH ...
- Ajax 技术一
一.Ajax概述 1.历史起源 1998年,微软公司Outlook Web Access研发小组在当时的IE浏览器中集成了一种技术,可以在客户端无刷新的前提下向服务器端发送Http请求,这门技术称之为 ...
- AJAX技术的核心
//创建一个XMLHttpRequest对象 ,利用此对象与服务器进行通信 是AJAX技术的核心 /** * 获取XmlHttpRequest对象 */ function getXMLHttpRequ ...
- 你真正的了解Ajax？Ajax技术简述
Ajax技术是目前在浏览器中通过JavaScript脚本可以使用的所有技术的集合.Ajax并没有创造出某种具体的新技术,它所使用的大多数技术都是在很多年以前就已经存在了,然而Ajax以一种崭新的方式来 ...
随机推荐
- java8 ArrayList源码阅读
转载自 java8 ArrayList源码阅读 本文基于jdk1.8 JavaCollection库中有三类:List,Queue,Set 其中List,有三个子实现类:ArrayList,Vecto ...
- virtualbox下面安装ubuntu后外网如何远程ssh访问
这两天在折腾virtualbox安装linux的事情,想多弄几个节点,装hadoop, 环境如下 两台thinkpad, 一台正常上班用的,win7 一台装的ubuntu kylin 16.04, 上 ...
- Taylor定理证明
下图,单独打开查看 当n->inf时如果 Rn(c)趋0, c属于(a,x), 那么在区间(a,x) 内函数在a点生成的taylor级数收敛到函数f.
- gulp-rev-orig
给客户演示项目时,老是会出现由于缓存,造成的最新的样式或者效果出不来的情况,还得需要手动清除缓存操作,一方面呢,会给客户留下不好的印象,而且也会多了清缓存这一过程,和同事商量过后,决定使用在css或者 ...
- 电子数字 网易游戏在线笔试 第一题 hihocoder
题目链接 http://hihocoder.com/contest/ntest2016spring1/problem/1 这个题目有几个算法考点: (1)对于一个LED数码管(由7个发光二极管封装在一 ...
- node的事件模块应用（译）
第一次接触Node.js时,就觉得他只不过是用javascript实现的服务端.但实际上他提供了许多浏览器端不具备的方法,比如EventEmitter类.我们在本文中来学习如何使用EventEmitt ...
- XML转JSON
Step 1 : 下载 java-json.jar http://www.java2s.com/Code/JarDownload/java/java-json.jar.zip Step 2: 增加 j ...
- ListView之头部浮动效果
ListView 中有时需要在顶部固定一个浮动栏,当向上滑动 ListView 时,浮动栏固定在顶部,当向下滑动 ListView 到其 HeaderView 可见时,浮动栏成为ListView的一部 ...
- 转行IT行业的心路历程3
16年丝袜生意很差的一年,老板的态度也不好,大唐本地人太歧视外地人了.而且我干的不开心没有前途,不能体现自我价值,无论你怎么努力. IT技术行业却不是这样,只要你努力肯学习,一定会有回报的. 在16/ ...
- js实现单文件以及多文件下载
<script type="text/javascript"> /** * Javascript 多文件下载 * @author Barret Lee * @email ...