<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>基于JQuery的注册页面</title>
<script type="text/javascript" src="jquery-1.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#userName").blur(function(){
$.get("ValidUserName", {userName: $("#userName").val()},
function(xml){
var text = $("Response",xml).text();
var html;
//alert(text);
if(text == "valid"){
html = "您输入的用户名可以使用";
$("#validationMessage").css("background-color","#FFCC66");
}else{
html = "您输入的用户名已经被使用";
$("#validationMessage").css("background-color","#FF0000");
}
$("#validationMessage").html(html);
});
});
});
function processResponse(xml){
alert( xml);
}
</script>
</head>
<body>
<form action="register">
<table>
<tr><td>用户名:</td>
<td><input type="text" name="userName" id="userName" >
<span id="validationMessage" style="background-color:ffcc66"></span></td></tr>
<tr><td> </td><td><input type="submit" name="submit" value="提交" id="submit"></td></tr>
</table>
<div id="xml"></div>
</form>
</body>
</html>
原文地址:
http://huxiaofei590.blog.163.com/blog/static/3259612200711652857902/
分享到：
相关推荐
【基于jQuery的Ajax聊天室程序】是一个典型的Web交互应用，它利用了Ajax技术来实现实时的、无需页面刷新的用户交流。Ajax（Asynchronous JavaScript and XML）是一种在不重新加载整个网页的情况下，能够更新部分网页...
这是一个关于使用jQuery AJAX、Cropper.js插件以及Spring Boot框架实现图片裁剪和存储功能的程序实例。这个压缩包包含了所有必要的代码和配置文件，帮助开发者理解如何在Web应用中处理图片的上传、裁剪、存储和检索...
"基于jQuery的ajax对话框"是一个利用jQuery实现的功能，它可以在不刷新整个页面的情况下，通过Ajax技术加载并显示新的内容在一个弹出的对话框里，提供了一种优雅的用户体验。 首先，让我们来了解jQuery的核心概念。...
这篇文章主要介绍了基于jquery ajax的多文件上传进度条过程解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 效果图 前端代码，基于jquery <!DOCTYPE ...
综上所述，基于jQuery Ajax实现下拉框无刷新联动的核心在于利用Ajax进行异步数据请求，动态更新下拉框的内容，同时通过事件监听和回调函数来处理用户的交互。这种方法不仅提高了用户体验，还降低了服务器负载，因为...
PHP 基于 jQuery 的 Ajax 技术传递 JSON 数据简单实例 本文主要介绍了 PHP 基于 jQuery 的 Ajax 技术传递 JSON 数据方法，以完整实例形式分析了 PHP 基于 jQuery 的 Ajax 无刷新提交数据实现方法。下面是详细的知识...
标题“基于Jquery和Ajax的多选框”暗示我们关注的是如何利用这两项技术来实现一个功能完善的多选框组件。这种组件通常用于用户需要从多个选项中选择一个或多个的情况，如设置偏好、选择服务等。 描述中提到，这个...
通过以上步骤，我们可以成功构建一个基于jQuery Masonry插件和Ajax技术的瀑布流动态加载数据功能。这个功能不仅提高了页面的可读性和互动性，还能有效减少服务器负载，因为只有在需要时才会请求新数据。
《jQuery AJAX 技术详解——基于传智播客课件》 在当今的Web开发中，jQuery AJAX（异步JavaScript和XML）技术扮演着至关重要的角色。它允许开发者在不刷新整个页面的情况下与服务器进行数据交换，提高了用户体验，...
基于jQuery 的Ajax完整拖动实例，可以动态添加一个新的拖动实例，可以无刷新切换网页风格，可以适时编辑模块内容，指定拖动区域。实例简单，易于理解，作为能考很不错。请在IIS下运行本实例，源码爱好者测试演示如上...
Struts2作为一个MVC（Model-View-Controller）框架，提供了强大的控制层逻辑，而jQuery则是一种高效的JavaScript库，简化了DOM操作、事件处理以及Ajax通信。在这个"商品小系统"中，它们的结合使用可以实现快速的数据...
jQuery UI是基于jQuery的一个扩展库，提供了许多可交互的UI组件，如对话框、日期选择器、拖放功能等。在使用jQuery AJAX时，jQuery UI可以辅助构建更丰富的用户界面。 综上所述，"jquery ajax demo"涵盖了jQuery ...
Ajax框架就是提供模块化实现Ajax功能的集合，Ajax框架可以是各种语言实现的（比如SAJAX有各种语言的实现），Ajax只是jquery中的一部分, 实例1 代码如下: $.ajax({ type:’post’,//可选get url:’action.php’,//...
为了解决这个问题，我们可以采用基于jQuery的Ajax异步分页技术。本篇文章将详细介绍如何利用jQuery实现Ajax异步分页，以及其背后的原理和实践应用。 首先，让我们理解什么是Ajax。AJAX（Asynchronous JavaScript ...
在IT行业中，jQuery和ajax是两个非常重要的技术，它们在构建动态、交互性强的Web应用程序时发挥着关键作用。在这个“jQuery+ajax实现三级级联”的实例中，我们主要探讨如何利用这两种技术来创建一个能够逐级联动的...
知识点一：jQuery Ajax上传文件的方法 在本文中，主要介绍了如何使用jQuery Ajax上传文件。具体实现方式是通过创建FormData对象，然后将表单数据作为Ajax请求的内容发送到服务器。在Ajax请求中，需要设置type为"POST...
在这个"基于jQuery的Ajax在线词典"项目中，$.ajax()函数被用来从服务器获取数据，可能用于查询单词的定义、例句等信息。 首先，我们来了解一下jQuery的$.ajax()方法的基本结构： ```javascript $.ajax({ type: '...
**基于jQuery的Ajax后台模板框架详解** 在现代Web开发中，前端与后端的交互扮演着至关重要的角色，Ajax（Asynchronous JavaScript and XML）技术的出现使得页面无需刷新即可完成数据的异步更新，极大地提升了用户...