ajax长链接--拉实现
2012-02-13 15:19
204 查看
很多时候需要用在网页上实时显示数据,这个时候一般要用到长链接技术。最简单的实现就是ajax轮询,也就是拉的方式。 下面是一个简单的例子:在网页上实时显示服务器时间。
后端WebService代码:
前段html代码:
后端WebService代码:
/// <summary> /// ServerTime 的摘要说明 /// </summary> [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] [ScriptService] public class ServerTime : System.Web.Services.WebService { /// <summary> /// 获取服务器端时间 /// </summary> /// <returns></returns> [WebMethod] [ScriptMethod(UseHttpGet=true, ResponseFormat=ResponseFormat.Json)] public string GetTime() { return DateTime.Now.ToString("yyyy-MM-dd hh-mm-ss"); } }
前段html代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript" src="Scripts/jquery-1.4.1.js" ></script> <script type="text/javascript"> function callWebService(url, param, handler) { $.ajax({ url: url, data: param, type: "get", dataType: "json", contentType: "application/json; charset=utf-8", success: function (p) { handler(p.d); } }); }; </script> </head> <body> <script language="javascript" type="text/javascript"> //轮询刷新服务器时间 setInterval(showTime, 1000); function showTime() { callWebService("ServerTime.asmx/GetTime", null, function (data) { $("#serverTime").html(data); }); } </script> <div id="serverTime"></div> </body> </html>
相关文章推荐
- ajax实现点击不同的链接让返回的内容显示在特定div里
- ajax实现点击不同的链接让返回的内容显示在特定div里
- 用ajax实现预览链接可以看到链接的内容
- WebSocket实现长链接原理以及和ajax轮询、long poll的对比
- 用ajax实现预览链接
- 关于用ajax长链接轮询方式实现comet时,其他ajax请求被阻塞的问题
- 用ajax实现预览链接可以看到链接的内容
- 对比javascript与jquery对ajax的实现
- AjaxPro.NET实现TextBox智能获取服务端数据功能(Asp.net 2.0)(示例代码下载)
- 用jQuery + Ajax实现Google输入提示功能
- jsp中验证码的实现,以及ajax实现的正确的验证,解决了session不同步的问题。(我这里已测试过,可以直接用)
- 13-Ajax链接与Ajax表单的快速对比Demo
- JQuery+Ajax实现下拉框联动(省市联动)
- Ajax技术验证用户名是否可用,简单实现
- HTML5 Canvas中实现文字链接
- 使用jQuery方便快捷的实现Ajax功能
- 一起谈.NET技术,用Dojo实现Ajax请求:XHR、跨域、及其他
- Ajax原理实现
- 实现zblog博客友情链接双栏展示的技巧
- 【代码】用div+css实现 在新窗口中打开指定的DIV标签下链接