ajax---简单使用Demo

小鱼儿 2022-03-11 05:37 195阅读 0赞

简单的ajax 使用demo。

前台文本框失去焦点（还可以是其他事件）就后台执行查询。

同时还会回馈给前台。

<script type="text/javascript">
    	function Createregxml() {
    		try {
    			regxml = new ActiveXObject("Microsoft.XMLHTTP");
    		} catch (e) {
    			try {
    
    				regxml = new ActiveXObject("Msxm12.XMLHTTP");
    			} catch (E) {
    				regxml = false;
    			}
    		}
    
    		if (!regxml && typeof XMLHttpRequest != 'undefined') {
    			regxml = new XMLHttpRequest();
    		}
    		return regxml;
    	}
    
    	function returnI() {
    
    		if (regxml.readyState == 4) {
    			var Data = regxml.responseText;
    			// alert(Data);
    			var str = Data.substring(0, 3);
    			//alert(str);
    			if (str == "yes") {
    				var divobj = document.getElementById("divusername");
    				divobj.innerHTML = "<font color=greed>√</font>可以注册检查通过。";
    			} else {
    				var divobj = document.getElementById("divusername");
    				divobj.style.display = "block";
    				divobj.innerHTML = "<font color=red>×</font>这个用户名已经被注册了，请换一个";
    			}
    		}
    	}
    
    	function chcek() {
    		var username = document.getElementById("username").value;
    		alert(username);
    		regxml = Createregxml();
    		regxml.onreadystatechange = returnI;
    		var url = "service.jsp?";
    		regxml.open("post", url + "username=" + username);
    		regxml.send(null);
    	}
    </script>

<body>
    	<input type="text" name="username" id="username" οnblur="chcek()">
    	<div id="divusername"></div>
    </body>

service.jsp

后台执行查询操作

<%
    	String username = request.getParameter("username");
    	System.out.println(username);
    	out.clear();
    	if ("chen".equals(username)) {
    		out.print("no");
    	} else {
    		out.print("yes");
    	}
    %>

发表评论取消回复

表情：

评论列表（有 0 条评论，195人围观）

还没有评论，来说两句吧...

相关阅读

相关【js】ajax的简单使用

1ajax AJAX 是 Asynchronous JavaScript and XML的缩写，即异步的 JavaScript 和 XML。它是jQuery里的方法作

朴灿烈づ我的快乐病毒、/ 2022年11月27日 07:22/ 0 赞/ 134 阅读

相关 vue-router使用简单demo

> `vue-router使用简单demo` > 1.首先安装`vue-router` npm install vue-router -s > 2.创建两个

偏执的太偏执、/ 2022年11月12日 08:22/ 0 赞/ 129 阅读

相关 socket 简单demo

服务端代码； public class SocketService { publ

待我称王封你为后i/ 2022年09月24日 13:20/ 0 赞/ 235 阅读

相关 jQuery Ajax 案例 Demo

[jQuery 下载地址][jQuery] http://code.jquery.com/jquery-1.7.1.min.js 案例:jQueryAjax

电玩女神/ 2022年06月16日 10:53/ 0 赞/ 212 阅读

相关 volley框架简单使用demo

一、volley简介 Volley 是 Google 推出的轻量级 Android 异步网络请求框架和图片加载框架。在 Google I/O 2013 大会上发布。其适用

迈不过友情╰/ 2022年06月11日 01:52/ 0 赞/ 276 阅读

相关 AJAX.Demo

ajax发送异步请求（四步操作） XMLHttpRequest \ajax其实只需要学习一个对象：XMLHttpRequest，如果掌握了它，就掌握了ajax！！！

墨蓝/ 2022年06月04日 05:56/ 0 赞/ 167 阅读

相关 Ajax简单使用

Ajax简单使用通常向服务器发送请求的方法：使用浏览器地址栏，输入地址，get请求 HTML的form表单发送请求，method属性可以设置get和

傷城~/ 2022年05月12日 08:22/ 0 赞/ 214 阅读

相关 Ajax的简单使用

简介 GET和POST请求 ajax\_demo01.jsp ajax\_demo01Servlet.java ajax\_demo02servlet.java 结果

爱被打了一巴掌/ 2022年04月23日 10:16/ 0 赞/ 204 阅读

相关 TCP简单demo

客户端: package com.yfy.net; import java.io.BufferedWriter; import java.io.IOExceptio

快来打我*/ 2022年03月16日 06:48/ 0 赞/ 258 阅读

相关 ajax---简单使用Demo

简单的ajax 使用demo。前台文本框失去焦点（还可以是其他事件）就后台执行查询。同时还会回馈给前台。 <script type="text/javascr

小鱼儿/ 2022年03月11日 05:37/ 0 赞/ 196 阅读