`

JQUERY AJAX定时操作服务器数据

阅读更多
1.需要json-lib.jar支持。
依赖包:commons-beanutils.jar
       commons-collections.jar
       commons-httpclient.jar
       commons-lang.jar
       commons-logging.jar
       ezmorph.jar
       morph.jar
2.servlet代码:
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;


public class TestAjax extends HttpServlet {
	
	private static final long serialVersionUID = 1L;
	static int i = 0;

	@SuppressWarnings("unchecked")
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		
		i++;
		response.setContentType("text/html;charset=utf-8");
		
		PrintWriter out = response.getWriter();

		List list = new ArrayList();

		User u = new User();
		u.setName("偶尔" + i);
		u.setSex("女" + i);
		User u1 = new User();
		u1.setName("现在" + i);
		u1.setSex("男" + i);
		list.add(u);
		list.add(u1);

		JSONArray obj = JSONArray.fromObject(list);

		out.println(obj.toString());
		out.flush();
		out.close();
	}
}
      
3.jsp页面
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<title>JQUERY AJAX定时操作服务器数据</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<script type="text/javascript"
			src="<%=basePath%>js/jquery-1.4.4.min.js">
</script>
		<script type="text/javascript">

$(document).ready(function() {
	setInterval(getList, 1000);//每隔1秒调用一次getList()
	});
function getList() {
	//发送post请求
	$.post("TestAjax", function(data) {
		$("table").empty();
		$("table").append("<tr><td style='color:red'>用户性别</td><td>用户名</td></tr>");
               //循环输出json数组
		$.each(eval(data), function(i){
			$("table").append('<tr><td>' + eval(data)[i].sex + '</td>' + '<td>' + eval(data)[i].name + '</td></tr>');

			});

	});
}
</script>
	</head>

	<body>
		<table>
			<tr>
				<td>
				用户性别
				</td>
				<td>
				用户名
				</td>
			</tr>
		</table>
	</body>
</html>

说明:post提交方式没有问题啦        
分享到:
评论
1 楼 csjxhx 2013-08-02  
竟然木有效果,,,

相关推荐

    jquery实现Ajax定时局部页面刷新

    ### jQuery 实现 AJAX 定时局部页面刷新 #### 背景介绍 在现代Web开发中,用户体验至关重要。用户往往不希望每次查看新数据时都必须手动刷新整个页面。为了解决这一问题,并提高用户体验,我们可以利用AJAX技术实现...

    php+jQuery ajax实现的实时刷新显示数据功能示例

    在本文实例中,使用ajax的GET方法定时向服务器发送请求,获取数据,然后更新网页内容。 ajax请求中的主要属性和方法包括: 1. type:指定请求方式,本文示例中为"GET"。 2. url:指定请求的服务器地址。 3. ...

    传智播客 jQuery ajax 课件

    - 实时更新数据:如股票报价、天气预报等,通过定时AJAX请求获取最新数据。 - 动态加载内容:如分页、无限滚动等,只加载可视区域内的数据,提高页面加载速度。 通过深入学习和实践jQuery AJAX,开发者能够构建...

    Ajax定时读取数据库.rar

    总的来说,"Ajax定时读取数据库"项目是一个很好的学习资源,它涵盖了Web开发中的多个重要概念,包括异步通信、动态网页更新、服务器端编程以及数据库操作。对于想要提升Web开发技能的程序员来说,这是一个值得深入...

    Ajax定时读取数据库(源代码发布)

    在Ajax定时读取数据库的实现中,关键在于设置定时器。JavaScript的`setInterval`函数用于每隔一定时间执行一次指定的函数。例如,我们可以设定每5秒执行一次Ajax请求,代码如下: ```javascript var ...

    【原创】苦苦寻找的: ajax 定时读取数据,无刷新在页面显示

    【标题】:“【原创】苦苦寻找的:ajax定时读取数据,无刷新在页面显示” 在Web开发中,用户界面的实时更新是一个常见的需求,比如股票价格的动态变化、聊天室的消息即时显示等。传统的HTTP请求方式需要用户手动...

    Jquery progressbar通过Ajax请求获取后台进度演示

    1. **发送请求**:使用jQuery的`.ajax()`方法向服务器发送异步请求,获取任务的进度信息。 ```javascript function fetchProgress() { $.ajax({ url: 'progress.action', // Struts2的Action,用于返回进度信息 ...

    Django结合ajax进行页面实时更新的例子

    在Ajax的`success`回调函数中,我们可以获取到服务器返回的数据,然后根据需求更新页面元素。例如,如果我们在页面上有一个图表(如Echarts),我们可以更新图表的系列数据: ```javascript success: function ...

    ajax实现无刷新对数据库的操作

    3. **修改操作**:类似添加,用户编辑数据后,Ajax 将更新后的数据发送到服务器。服务器执行 SQL 更新语句,然后返回更新结果。客户端接收到响应后,更新显示的数据。 在提供的文件列表中,我们看到 `index.asp` 和...

    Ajax定时显示消息(JSP)源码

    总结来说,Ajax定时显示消息(JSP)的实现结合了客户端的JavaScript异步请求和服务器端的JSP动态生成内容。通过这种方式,用户可以在不刷新整个页面的情况下,实时获取并展示新的消息,提高了用户体验。同时,这种技术...

    基于PHP的jqueryajax无刷新评论 无刷新翻页,字数统计 绝对可以用.zip

    "基于PHP的jqueryajax无刷新评论 无刷新翻页,字数统计 绝对可以用.zip" 这个压缩包文件包含了实现这一目标的核心技术。下面将详细阐述这些技术及其应用。 首先,PHP是一种广泛使用的服务器端脚本语言,它允许...

    ajax实现自动读取数据

    本篇文章将深入探讨如何使用AJAX实现自动读取数据库数据,并根据用户需求进行定时读取。 首先,我们需要理解AJAX的基本原理。AJAX通过创建XMLHttpRequest对象,向服务器发送异步请求,获取数据,然后通过JavaScript...

    一天搞定jQuery(一)——使用jQuery完成定时弹出广告

    jQuery的`.ajax()`方法可以方便地实现异步请求,其参数包括URL、类型(GET或POST)、数据以及成功和失败的回调函数。 总结起来,通过学习和理解jQuery的选择器、事件处理、动画效果、组织结构以及Ajax交互,你可以...

    AJAX(jquery)模拟股票涨跌实时显示功能

    3. **AJAX 请求**:使用 jQuery 的 `$.ajax()` 或 `$.get()` 方法发起 AJAX 请求,向服务器请求股票数据。URL 参数指定服务器接口,可能还需要设置数据类型(如 JSON)。 4. **服务器端**:服务器端通常会有一个...

    Jquery插件小集合(ajax 投票 AJAX动态加载广告)

    - `$.ajax()`函数被用来向服务器请求新的广告数据,通常包括HTML代码、广告图片URL等。 - **服务器响应**: - 服务器端脚本(未在文件列表中给出)接收到请求后,返回最新的广告内容。 - **DOM操作**: - 接收...

    ajax例子—jquery相关例子

    jQuery提供了$.ajax()、$.get()、$.post()等方法来发起Ajax请求,这些方法使得与服务器端的数据交互变得更加直观和简单。 1. **$.ajax()**: 这是jQuery提供的一个核心Ajax函数,可以配置各种参数,如URL、类型(GET...

    Ajax-JQuery

    3. **实时通信**:通过定时发送Ajax请求,可以实现与服务器的实时通信,例如聊天室。 4. **数据验证**:在用户输入时,通过Ajax向服务器发送请求验证数据的有效性,提高用户体验。 5. **地图定位**:在地图应用中...

    用jQuery,jqplot,Servlet和Ajax做的CPU性能实时监控动态图

    首先,jQuery是一个广泛使用的JavaScript库,提供了丰富的API来简化DOM操作、事件处理和AJAX交互。在这个项目中,jQuery被用来处理用户界面的事件,如按钮点击,以及发起Ajax请求来获取服务器端的数据。 jqPlot是...

    韩顺平AJAX和jquery笔记整理

    - **黄金价格波动图**:通过定时向服务器发送请求获取最新的黄金价格数据,绘制实时价格曲线图,增强图表的实时性和互动性。 #### AJAX实现聊天室功能 - **功能实现**: - 用户发送消息时,使用AJAX将消息发送到...

Global site tag (gtag.js) - Google Analytics