zoukankan      html  css  js  c++  java
  • ajax实例Ajax实例

    发一下牢骚和主题无关:

        最近想学着J2EE来着,就学到了Ajax这个东西,就跟着学了点,下面就给个实例,省的自己当前用到了也不知道哪找去。

        html页面:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>user_info.html</title>
    	
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    
    <script type="text/javascript">
      
      String.prototype.trim = function() {
      	return this.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
     }
      	var xmlHttp;
      	
      	function createXMLHttpRequest(){
      		if(window.XMLHttpRequest){
      			xmlHttp=new XMLHttpRequest();
      		}else{
      			xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      		}
      	}
      
    	function validate(user){
    	
    		if(user.value.trim().length!=0){
    
    			createXMLHttpRequest();
    			var url="user_validate.jsp?userNumber="+user.value.trim()+"&time="+new Date().getTime();
    			xmlHttp.open("get",url,true);
    			
    			// 把方法地址赋值给xmlHttp的onreadystatechange属性
    			xmlHttp.onreadystatechange=callback;
    			
    			xmlHttp.send(null);
    		}
    	}
    	
    	function callback(){
    	//	alert(xmlHttp.readyState);
    		if(xmlHttp.readyState==4){ // Ajax引擎初始化完成
    			if(xmlHttp.status ==200){ // http 200响应
    			//	alert("请求胜利");
    		//	alert(xmlHttp.responseText);
    				document.getElementById("spanuserNumber").innerHTML="<font color='red'>"
    				+xmlHttp.responseText+"</font>"
    			}else{
    				alert("请求错误"+xmlHttp.status);
    			}
    		}
    	}
    	
    </script>
      
    
    
      </head>
      
      <body>
      
      
        This is my HTML page. <br>
        
        <form name="input" action="html_form_action.asp" method="get">
        <table border =0 >
        <tr>
    	<td>Usernumber: </td>
    	<td><input type="text" name="usernumber" id="usernumber" onblur="validate(this)"/>
    	<span id="spanuserNumber"></span>
    	</td>
    	</tr>
    	<tr>
    	<td>Username:</td>
    	<td> <input type="text" name="username" />
    	</td>
    	</tr>
    	<tr>
    	<td>
    	null:
    	</td>
    	<td> <input type="text" name="user" />
    	</td>
    	</tr>
    	<tr>
    	<td>
    	<input type="submit" value="Submit" />
    	</td>
    	</tr>
    </table>
    </form>
      </body>
    </html>
        每日一道理
    翻开早已发黄的页张,试着寻找过去所留下的点点滴滴的足迹。多年前的好友似乎现在看来已变得陌生,匆忙之间,让这维持了多年的友谊变淡,找不出什么亲切感,只是偶尔遇上,淡淡地微笑,如今也只能在这发黄的页张中找寻过去的那些让人难忘的,至少我可以握住这仅剩下一段的“丝线头”……

        这里用到了trim(),按照教程的是用trim(str),而不是 str.trim()调用,上网查了下才发明IE不支持,而且实现这个的方法居然又十几种之多,http://www.cnblogs.com/rubylouvre/archive/2009/09/18/1568794.html

        提交到Ajax的jsp页面如下:

    <%@ page language="java"  pageEncoding="UTF-8"%>
    <%@ page import ="com.fillblank.jdbc.*"%>
    
        <%
        	String userNumber=request.getParameter("userNumber");
        	if(JDBCConnection.findByUserNumber(userNumber)){
        		System.out.print("JDBCConnection.findByUserNumber()--userer="+userNumber);
        		//out.println("the number is already in use");
        		out.println("号码已存在");
        	}
        
         %>

        然后涌现的效果如下:

        ajax和实例

        对于ajax整体感觉用起来不错,不过个人感觉似乎也只是供给了一个用户友爱的页面而已,其他似乎就没啥用了?

    文章结束给大家分享下程序员的一些笑话语录: 祝大家在以后的日子里. 男生象Oracle般健壮; 女生象win7般漂亮; 桃花运象IE中毒般频繁; 钱包如Gmail容量般壮大, 升职速度赶上微软打补丁 , 追女朋友像木马一样猖獗, 生活像重装电脑后一样幸福, 写程序敲代码和聊天一样有**。

    --------------------------------- 原创文章 By
    ajax和实例
    ---------------------------------

  • 相关阅读:
    jdk-8u271-windows-x64
    wps 2019 专业版最新激活密匙
    未分页内存泄露
    Nonpaged Pool(未分页池)占用内存过多分析定位
    python异常处理
    如何开发在线考试系统
    kvm学习
    MySQL安全审计-等保2.0
    Linux下启动/关闭Oracle
    rocketmq systemctl 启动
  • 原文地址:https://www.cnblogs.com/jiangu66/p/3106707.html
Copyright © 2011-2022 走看看