页面：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”中，你应该能找到一个具体示例，帮助你更好地理解和应用这些概念。
在JavaScript的世界里，jQuery是一个非常流行的库，它极大地简化了DOM操作、事件处理以及Ajax交互。本实例聚焦于"jQuery-AJAX"，这是一项核心功能，用于在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容...
**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 是一种在不刷新整个网页的情况下，...