应用ajax实现检测注册用户名是否已经存在

最新推荐文章于 2019-12-27 16:35:50 发布

weixin_34354173

最新推荐文章于 2019-12-27 16:35:50 发布

阅读量460

点赞数

文章标签：数据库 javascript 开发工具 ViewUI

前面写了一些ajax基础知识，那么具体如何应用？
在这里我将我3月12课件中的一个例子整理下来！
主要实现了用户注册自动检测用户名是否已经存在的功能！
类似 http://bbs.langsin.com/register.php，输入用户名注册可以检测是否已经存在，不过该网站的这个功能并没有应用ajax，而是类似服务器控件的回传，使整个页面有刷新。
这里还是使用的《一个简单的Ajax开发框架》一文ajax小框架来做！开发工具选择Eclipse！
Step1：新建一个WEB项目，做一个login.jsp页面

@ page contentType="text/html; charset=gb2312"%>

@ page import="eflylab.ajax.login.*"%>

<html>

<head>

function doCheck(type)

{

var f = document.forms[0];

if("user"==type)

{

if(f.username.value!="")

{

document.getElementById("feedback_info").innerHTML = "系统正在处理您的请求，请稍后。";

send_request("GET","registerCheck.jsp?field=username&value="+f.username.value,null,"text",showFeedbackInfo);

}

else

{

document.getElementById("feedback_info").innerHTML = "请输入用户名称。";

}

else if("email"==type)

{

if(f.email.value!="")

{

//正则表达式来检测电子邮件的格式

var pattern = /^[\w＼.\-\_]+@

{1}\w+(\.

{1}\w+)+$/;

var result = pattern.exec(f.email.value);

if(result==null) window.alert("电子邮件格式错误，请按标准email名称格式填写,如：hello@sohu.com。");

else

{

document.getElementById("feedback_info").innerHTML = "系统正在处理您的请求，请稍后。";

send_request("GET","registerCheck.jsp?field=email&value="+f.email.value,null,"text",showFeedbackInfo);

}

else

{

document.getElementById("feedback_info").innerHTML = "请输入电子邮件。";

}

//处理服务器回传信息函数

function showFeedbackInfo()

{

if (http_request.readyState == 4)

{ // 判断对象状态

if (http_request.status == 200)

{ // 信息已经成功返回，开始处理信息

//alert(http_request.responseText);

document.getElementById("feedback_info").innerHTML = http_request.responseText;

} else

{ //页面不正常

alert("您所请求的页面有异常。");

}

function aa()

{

alert('OK');

}

</script>

</head>

<tr>

</td>

</tr>

<tr>

</tr>

<tr>

</td>

</tr>

<tr>

</tr>

</tr>

</table>

</form>

</center>

</body>

</html>

在上面的login.jsp中　用户姓名一块触发了一个Javascript.　提交到registerCheck.jsp处理。

registerCheck.jsp

@ page contentType="text/html; charset=gb2312"%>

@ page import="eflylab.ajax.login.*"%>

String field = request.getParameter("field");

String value = request.getParameter("value");

UserService service = new UserService();

if("username".equalsIgnoreCase(field)) {

UserValue user = service.findUserByName(value);

if(user!=null) out.println("用户名称["+value+"]已经被注册，请更换其他用户名称再注册。");

else out.println("用户名称["+value+"]尚未被注册，您可以继续。");

}

else if("email".equalsIgnoreCase(field)) {

try {

UserValue user = service.findUserByEmail(value);

if(user!=null) out.println("电子邮件["+value+"]已经被注册，请更换其他用户名称再注册。");

else out.println("电子邮件["+value+"]尚未被注册，您可以继续。");

}catch(Exception ex) {

out.println(ex.toString());

}

else {

out.println("参数错误。");

}

该页面调用javabean进行处理，然后在javabean中我们可以从数据库中检测数据，然后将结果返回！
login.jsp页面主要使用了responseTEXT来进行处理！
我们看到效果了！

weixin_34354173

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
应用ajax实现检测注册用户名是否已经存在

前面写了一些ajax基础知识，那么具体如何应用？在这里我将我3月12课件中的一个例子整理下来！主要实现了用户注册自动检测用户名是否已经存在的功能！类似http://bbs.langsin.com/register.php，输入用户名注册可以检测是否已经存在，不过该网站的这个功能并没有应用ajax，而是类似服务器控件的回传，使整个页面有刷新。这里还是使用的《一个简单的Ajax开发框架》一文ajax小...
复制链接

扫一扫