当前位置: 网学 > 编程文档 > Ajax > 正文

asp+Ajax简单客户登陆验证

来源:Http://myeducs.cn 联系QQ:点击这里给我发消息 作者: 用户投稿 来源: 网络 发布时间: 13/07/10
器http_request = new XMLHttpRequest();if (http_request.overrideMimeType) {//设置MiME类别http_request.overrideMimeType("text/xml");}}else if (window.ActiveXObject) { // IE浏览器try {http_request = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {try {http_request = new ActiveXObject("Microsoft.XMLHTTP");} catch (e) {}}}if (!http_request) { // 异常,创建对象实例失败window.alert("不能创建XMLHttpRequest对象实例.");return false;}http_request.onreadystatechange = processRequest;// 确定发送请求的方式和URL以及是否同步执行下段代码http_request.open("GET", url, true);http_request.send(null);}// 处理返回信息的函数function processRequest() {if (http_request.readyState == 4) { // 判断对象状态if (http_request.status == 200) { // 信息已经成功返回,开始处理信息alert(http_request.responseText);} else { //页面不正常alert("您所请求的页面有异常。");}}}</script>7.3、简单的示例
  接下来,我们利用上面的开发框架来做两个简单的应用。

A、数据校验
  在用户注册的表单中,经常碰到要检验待注册的用户名是否唯一。传统的做法是采用window.open的弹出窗口,或者window. showModalDialog的对话框。不过,这两个都需要打开窗口。采用AJAX后,采用异步方式直接将参数提交到服务器,用window.alert将服务器返回的校验信息显示出来。代码如下:

  在<body></body>之间增加一段form表单代码:

<form name="form1" action="" method="post">
用户名:<input type="text" name="username" value=""> 
<input type="button" name="check" value="唯一性检查" onClick="userCheck()">
<input type="submit" name="submit" value="提交">
</form>

  在开发框架的基础上再增加一个调用函数:

function userCheck() {var f = document.form1;var username = f.username.value;if(username=="") {window.alert("用户名不能为空。");f.username.focus();return false;}else {send_request(''sample1_2.jsp?username=''+username);}}

  看看sample1_2.jsp做了什么:

<%@ page contentType="text/html; charset=gb2312" errorPage="" %><%String username = request.getParameter("username");if("educhina".equals(username)) out.print("用户名已经被注册,请更换一个用户名。");else out.print("用户名尚未被使用,您可以继续。");%>

  运行一下,嗯,没有弹出窗口,没有页面刷新,跟预想的效果一样。如果需要的话,可以在sample1_2.jsp中实现更复杂的功能。最后,只要将反馈信息打印出来就可以了。


B、级联菜单
  我们在第五部分提到利用AJAX改进级联菜单的设计。接下来,我们就演示一下如何“按需取数据”。

  首先,在<body></body>中间增加如下HTML代码:

<table width="200" border="0" cellspacing="0" cellpadding="0"><tr><td height="20"><a href="javascript:void(0)" onClick="showRoles(''pos_1'')">经理室</a></td></tr><tr style="display:none"><td height="20" id="pos_1"> </td></tr><tr><td height="20"><a href="javascript:void(0)" onClick="showRoles(''pos_2'')">开发部</a></td></tr><tr style="display:none "><td id="pos_2" height="20"> </td></tr></table>

  在框架的基础上增加一个响应函数showRoles(obj):

//显示部门下	 
			

网学推荐

免费论文

原创论文

设为首页 | 加入收藏 | 论文首页 | 论文专题 | 设计下载 | 网学软件 | 论文模板 | 论文资源 | 程序设计 | 关于网学 | 站内搜索 | 网学留言 | 友情链接 | 资料中心
版权所有 QQ:3710167 邮箱:3710167@qq.com 网学网 [Myeducs.cn] 您电脑的分辨率是 像素
Copyright 2008-2015 myeducs.Cn www.myeducs.Cn All Rights Reserved 湘ICP备09003080号