Ajax初体验--Sturts2+Ajax

一直久闻大名,没有用过,觉得很神秘,做毕业设计刚好要用到这个家伙,查了半天资料,总算搞定。。。。原理不是特别明白,不过能实现需求。。。

 

会骑车就行,管他车是怎么组装的,哪天要我组装车,我再来整

 

说下我实现的功能:

PS。。。在公司不能传图片,功能很简单,一个用户名文本框,用户输入用户名,焦点离开,判断用户名是否在数据库里存在。。。

我用到了一个struts2的json插件,下载地址:http://code.google.com/p/jsonplugin/downloads/list

 

直接上代码

 Action类 LoginJson

 

package com.lk.action;



public class LoginJson {
	private String un;
	
	public String getUn() {
		return un;
	}

	public void setUn(String un) {
		this.un = un;
	}
	
	public String execute() throws Exception {
			/**
			 * 连接数据库的代码
			 * 我这里用到的sql语句
			 * executeQuery("select * from admin where admId='"+un+"'")
			 */   
		   if(查询结果存在){
			   un="用户名存在";
		   }else{
			   un="用户名不存在";
		   }
		return "success";
	}
}


Struts.xml配置

 <package name="Struts2_AJAX_DEMO" extends="json-default"> 
        <action name="JsonPlugin2" class="com.lk.action.LoginJson">
            <result type="json" />
        </action>            
    </package>

注意package后面的extends

 

jsp的内容

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'MyJsp.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript">
		function isExists(str)
		{
		var xmlhttp;    
		if (str=="")
		  {
		  document.getElementById("txtHint").innerHTML="";
		  return;
		  }
		if (window.XMLHttpRequest)
		  {// code for IE7+, Firefox, Chrome, Opera, Safari
		  xmlhttp=new XMLHttpRequest();
		  }
		else
		  {// code for IE6, IE5
		  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
		  }
		xmlhttp.onreadystatechange=function()
		  {
		  if (xmlhttp.readyState==4 && xmlhttp.status==200)
		    {
		   var result = eval('(' + xmlhttp.responseText + ')');
		    
		    var isexists = result.un;
		    document.getElementById("txtHint").innerHTML=isexists;
	    }
		  }
		xmlhttp.open("GET","JsonPlugin2?un="+str+"&random=" + new Date().getMilliseconds()
		,true);
		xmlhttp.send();
	}
</script>

	
  </head>
  
  <body>
	    
		
		<input type="text" name="un" οnblur="isExists(this.value)"/>
		<div id="txtHint">判断输入的是否存在</div>
	

  </body>
</html>

大家不要被上面的JS吓住了,其实重点也就是下面的一部分,其他的无非就是判断浏览器啦生成相应的对象(xmlhttp)啦,不用多在意,基本是死的

做到这里就ok了,发布部署,输入http://localhost:8080/AjaxDemo/MyJsp3.jsp 就哦了

输入用户名 焦点移开后台就进行判断用户是否存在啦~

大家自由发挥吧。。。有问题可以邮箱我 或者留言~

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值