misswuyang 发表于 2013-2-6 09:40:11

初次使用Ajax

一直想在项目中用一次Ajax但是一直没有机会,终于在最近的一个项目中的注册的模块用到了
当时是准备用原生态的ajax做的,但是考虑到太麻烦,就利用jquery写了,发现效果还是不错的。

   现在的例子主要是前台的jsp页面:(下面的的主要的代码,至于后台Action的地方就没有写了)

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>XXXX注册</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="Robots" content="all" /></head><body><html-el:text property="entp_code" size="13" maxlength="13" styleClass="input" styleId="entp_code"/>            <span class="red" id="s_after">*</span>  <span id="loading" style="display:none;" mce_style="display:none;"><img src="images/loading.gif" style="vertical-align:middle; margin: 2px;" mce_style="vertical-align:middle; margin: 2px;" />正在处理...</span><mce:script type="text/javascript" src="${ctx}/commons/scripts/jquery.js" mce_src="${ctx}/commons/scripts/jquery.js"></mce:script><mce:script type="text/javascript" src="${ctx}/commons/scripts/validator.js" mce_src="${ctx}/commons/scripts/validator.js"></mce:script><mce:script type="text/javascript"><!--$("#entp_code").blur(function() { if(this.value.length > 0){$("#loading").ajaxStart(function(){$("#submit").attr("disabled", "true");$(this).show();});$("#loading").ajaxStop (function(){$(this).hide();});$("#tip").remove();$.ajax({    type: "POST",    url: "registerEntp.do",    data: "method=getLoginCode&entp_code=" + this.value,    dataType: "json",    error: function(request, settings) {alert("数据加载请求失败!"); },    success: function(isExist) {   if(isExist == 1) {      $("#s_after").after('<span id="tip" style="color:#FF0000;" mce_style="color:#FF0000;"><img src="images/reg_error.gif" /> 对不起,该企业代码已经存在!<\/span>');       $("#submit").attr("disabled", "true");      return;   } else if(isExist == 0){      $("#s_after").after('<span id="tip" style="color:#5A8E4A;" mce_style="color:#5A8E4A;"><img src="images/reg_success.gif" /> 恭喜,该企业代码可以使用。<\/span>');       $("#submit").attr("disabled", "");   }   }}); } else {$("#tip").remove(); }});// --></mce:script></body></html>

发表于 @ 2008年09月26日 14:53:00
页: [1]
查看完整版本: 初次使用Ajax