下面是一个用jquery实现的Ajax局部刷新。
实现的功能是在文本框中输入用户名后,在下面的<div>中显示出数据库中该用户的所有信息
js代码:
<script type="text/javascript">
$(function() {
$("#Submit").click(function() {
$("#show").html("");
$.ajax({
type : "POST", //请求方式
url : "user.do?method=selectByUserName",
cache : false,
data : "userName=" + $("#userName").val(), //传参
dataType : "html", //返回值类型 使用json的话也可以,但是需要在JS中编写迭代的html代码,如果格式样式
success : function(data) {
$("#show").html(data);
}
});
});
});
</script>
jsp:
<label for="textfield">请查询你要修改的用户</label> <input
name="userName" type="text" id="userName" /> <label
for="Submit"></label> <input type="button" name="Submit"
value="查询" id="Submit" />
在servlet得到userName:String userName =request.getParameter("userName");
跳转到显示数据界面:
<c:forEach items="${userList}" var="user">
<tr>
<td height="26" align="center" bgcolor="#FFFFFF"><a href="#">${user.name}</a>
</td>
<td align="center" bgcolor="#FFFFFF">${user.department}</td>
<td align="center" bgcolor="#FFFFFF">${user.mail}</td>
<td align="center" bgcolor="#FFFFFF">13800000001</td>
<td align="center" bgcolor="#FFFFFF">111111</td>
<td align="center" bgcolor="#FFFFFF">2188</td>
<td align="center" bgcolor="#FFFFFF"><a
href="<%=path%>/user/addUser.jsp">修改</a>
</td>
</tr>
</c:forEach>
分享到:
相关推荐
**jQuery学习资料详解** jQuery,一个轻量级、高性能的JavaScript库,自2006年发布以来,因其简洁易用的API接口和强大的功能,迅速成为开发者们首选的前端工具之一。本资料旨在深入浅出地介绍jQuery的核心概念、...
本压缩包包含的“精选jQuery学习资料”是针对这一强大的库进行深入学习的重要资源。 首先,我们来看看`jquery-1.2.6.js`,这是jQuery库的1.2.6版本的源代码文件。这个版本的历史悠久,但依然具有学习价值,因为它...
**jQuery学习资料大全** 在IT领域,jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript代码,使得网页交互和DOM操作变得更加便捷。这份“jQuery学习资料大全”提供了丰富的资源,无论你是初学者还是有...
《JQuery学习手册》是一份全面且深入的资源,旨在帮助开发者掌握JavaScript库JQuery的核心概念和实用技巧。这份手册不仅包含理论知识,还有实践应用的案例,是初学者和经验丰富的开发者提升JQuery技能的理想参考资料...
**jQuery学习网站** jQuery是一个广泛使用的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画制作和Ajax交互。由于其简洁的语法和强大的功能,jQuery成为了前端开发中的首选工具之一。 这篇博文链接...
**jQuery学习笔记(一)** 在深入探讨jQuery之前,我们首先要理解什么是jQuery。jQuery是一个高效、易用且功能丰富的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作和Ajax交互等任务。由John Resig在2006...
jquery学习资料+教程 包括五个文档:jQuery的起点教程,jQuery经典入门教程,jquery的基本用法.pdf,2010最新jQuery学习资料.pdf,精通JavaScript+jQuery.pdf
**jQuery学习示例大全** jQuery是一款广泛应用于网页开发的JavaScript库,它简化了HTML文档遍历、事件处理、动画设计和Ajax交互等任务。这个"jQuery学习示例大全"涵盖了从基础到进阶的各种示例,帮助开发者快速掌握...
Jquery学习笔记 Jquery学习笔记是指使用Jquery框架来实现javascript编程的笔记记录,本笔记记录了Jquery-1.2的基本用法、Ajax异步交互、XMLHttpRequest对象的基本应用等知识点。 一、Jquery基本用法 Jquery是一个...
这个“JQuery学习资料”压缩包包含了一系列与JQuery相关的学习资源,旨在帮助开发者深入理解和掌握JQuery的核心概念和实用技巧。 首先,`jquery1.4 API`是JQuery 1.4版本的官方API文档,它详细列出了该版本的所有...
**jQuery学习资料** jQuery是一款广泛应用于前端开发的JavaScript库,它极大地简化了JavaScript代码的编写,使得DOM操作、事件处理、动画制作等任务变得更加简单。本资料包包含了jQuery的学习资源,包括PPT教程和...
以下是对 jQuery 学习文档中提到的关键知识点的详细说明: 1. **jQuery 语法实例**: - `$(this).hide()`:隐藏当前选中的元素。 - `$("#test").hide()`:隐藏 ID 为 "test" 的元素。 - `$("p").hide()`:隐藏...
**jQuery学习笔记** jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript代码的编写,使得网页交互变得更加简单。这个资源包含了作者在自学jQuery过程中积累的笔记,以HTML页面的形式呈现,方便阅读和...
learn.jquery.com, jQuery学习中心网站内容 jQuery学习站点这里站点的目标是双重的:如何使用jQuery和JavaScript信息的中心。可以信。详细的详细信息。为了保持及时。活动和社区驱动的参考,具有相对较低的贡献。...
**jQuery学习资料** jQuery是一个广泛使用的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画制作和Ajax交互。这个学习资料包包含了多个面向初学者和中级开发者的资源,旨在帮助你快速掌握jQuery的核心...
《jQuery学习文档中文版》是面向初学者和进阶开发者的一份宝贵资源,它详尽地介绍了jQuery库的各种功能和用法。jQuery是一款强大的JavaScript库,简化了HTML文档遍历、事件处理、动画以及Ajax交互等任务,使得前端...
**jQuery学习课堂工具详解** jQuery,作为一款广泛应用于Web开发的JavaScript库,为开发者提供了简洁、高效的API,使得DOM操作、事件处理、动画设计以及Ajax交互变得更加简单。本"jQuery学习课堂工具"专注于帮助...