页面：index.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<script type="text/javascript" src="js/jquery-latest.js"></script>
<script type="text/javascript" src="js/jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#myForm").ajaxForm(function(o){
var aa = eval("(" + o + ")");
$("#show").slideDown("slow");
$("#name").html(""+aa.name+"");
$("#comment").html(""+aa.comment+"");
$("#myForm").hide();
});
});
function edit(){
$("#show").hide();
$("#myForm").slideDown("slow");
}
</script>
</head>
<body>
<div id="input">
<form id="myForm" action="ajax.do" method="post">
Name:
<input type="text" name="name" />
<br />
Comment:
<textarea name="comment"></textarea>
<br />
<input type="submit" value="保存" />
<br />
</form>
</div>
<div id="show" style="display: none;">
Name:
<span id="name"></span>
<br />
Comment:
<span id="comment"></span>
<br />
<input type="submit" value="修改" onclick="edit()"/>
<br />
</div>
<br />
</body>
</html>
类:AjaxAction
/**
* Method execute
*
* @param mapping
* @param form
* @param request
* @param response
* @return ActionForward
*/
public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) {
try {
JSONObject jobject = new JSONObject();
try {
jobject.append("name", request.getParameter("name"));
jobject.append("comment", request.getParameter("comment"));
} catch (JSONException e) {
e.printStackTrace();
}
response.setContentType("text/html");
response.setHeader("Cache-Control", "no-cache");
response.setCharacterEncoding("utf-8");
response.getWriter().write(jobject.toString());
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
分享到：
相关推荐
1. 初始化插件：在jQuery选择器中调用`ajaxForm`或`ajaxSubmit`方法来初始化插件。例如： ```javascript $("#myForm").ajaxForm(options); ``` 其中，`options`是一个对象，包含了各种配置参数，如成功回调、错误...
form id="form"> <input type="text" name="username"> <input type="file" name="file"> <input type="button" id="btn" value="提交"> </form> [removed][removed] [removed] ...
2. 初始化表单：通过`$.ajaxForm`或`$("#formId").ajaxSubmit`来绑定表单事件。 ```javascript $("#myForm").ajaxForm({ success: function(response) { console.log('表单提交成功:', response); }, error: ...
使用jQuery选择器选取要处理的表单，并调用`.ajaxForm()`或`.form()`方法初始化插件。 ```javascript $('#myForm').ajaxForm(options); ``` 其中，`#myForm`是表单的ID，`options`是一个可选的对象参数，用于...
【基于jQuery的Ajax聊天室程序】是一个典型的Web交互应用，它利用了Ajax技术来实现实时的、无需页面刷新的用户交流。Ajax（Asynchronous JavaScript and XML）是一种在不重新加载整个网页的情况下，能够更新部分网页...
**jQuery和Ajax技术详解** jQuery是一款非常流行的JavaScript库，它极大地简化了JavaScript的DOM操作、事件处理以及Ajax交互。在Web开发中，jQuery是实现动态和交互性网页的关键工具。Ajax（Asynchronous ...
在IT行业中，jQuery和Ajax是两个非常重要的技术，它们在构建动态、交互性强的Web应用程序时发挥着关键作用。jQuery是一个高效、简洁的JavaScript库，它简化了HTML文档遍历、事件处理、动画以及Ajax交互。Ajax...
本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先，了解同源策略是理解跨域问题的关键。同源策略是浏览器为了保障用户安全而设定的一项机制，它规定了只有来自同一协议、同一域名和同一...
在Asp.Net MVC中，使用jQuery和AJAX进行文件上传需要额外的插件，如jQuery Form Plugin。这个插件可以处理表单提交，包括文件上传。 七、异常处理和验证 在AJAX请求中，我们可以利用ASP.NET MVC的Validation ...
- 初始化插件：通过`$('form').ajaxForm(options)`或`$('form').form(options)`来启用插件，并设置相应的配置选项。 - 配置选项：如`beforeSubmit`、`success`、`dataType`等，控制表单提交前后的行为和数据处理...
在Web开发中，jQuery是一个非常流行的JavaScript库，它极大地简化了DOM操作、事件处理以及Ajax交互。本主题聚焦于jQuery中的Ajax功能，特别是如何利用它进行异步用户名验证。Ajax，即Asynchronous JavaScript and ...
这个库利用数据属性（data-* attributes）和jQuery事件来实现Ajax功能，使得页面的异步更新更加优雅和易于维护。 在传统的Web开发中，Ajax通常需要在JavaScript代码中添加大量细节，而jQuery Unobtrusive Ajax通过...
在Web开发中，jQuery是一个非常流行的JavaScript库，它极大地简化了DOM操作、事件处理和Ajax交互等任务。...在提供的压缩包文件“jqueryform”中，你应该能找到一个具体示例，帮助你更好地理解和应用这些概念。
**jQuery AJAX分页技术详解** 在Web开发中，分页是一种常见的数据展示方式，它能够有效地组织大量数据，提高页面加载速度，优化用户体验。jQuery，一个轻量级、功能丰富的JavaScript库，结合AJAX（异步JavaScript和...
jQuery Form插件是jQuery库中的一个强大工具，它极大地简化了HTML表单的处理，提供了异步提交（AJAX）功能，使得用户在无需页面刷新的情况下就能发送表单数据，提高了用户体验。这个插件依赖于jQuery核心库，如在本...
**jQuery Upload AJAX方式详解** 在Web开发中，文件上传是一个常见的功能，传统的文件上传通常需要刷新整个页面，用户体验较差。随着Ajax技术的发展，无刷新上传文件成为可能，jQuery结合Ajax提供了一种优雅的解决...
**jQuery：Ajax 的强大工具** jQuery 是一个广泛使用的 JavaScript 库，它极大地简化了前端开发中的许多任务，尤其是处理 AJAX（Asynchronous JavaScript and XML）请求。AJAX 是一种在不刷新整个网页的情况下，...
此外，`$.fn.ajaxSubmit`方法还可以接受一个完整的jQuery.ajax选项对象，这意味着你可以使用所有jQuery的Ajax选项，如`cache`、`timeout`、`contentType`等，来定制你的异步请求。 总结一下，jQuery.form插件通过...