<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Jquery20150305.aspx.cs" Inherits="Jquery20150305" %> <!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 runat="server"> <title>Jquery异步查询加载效果</title> <script src="https://www.jb51.net/JS/jquery-1.9.1.js" type="text/javascript"></script> <link href="https://www.jb51.net/Styles/Site.css" type="text/css" /> <style type="text/css"> .span_query { cursor:pointer;} </style> <script type="text/javascript"> $(function () { $(".span_query").click(function () { var val = $(this).attr("data-value"); var id = $(this).attr("id"); AjaxQuery($(this),val); }); }); function AjaxQuery(obj, v) { $.ajax({ url: 'Ajax/Handler.ashx?queryType=score&queryValue=' + v, type: 'POST', dataType: 'text', timeout: 10000, cache: false, beforeSend: LoadFunction, error: erryFunction, success: succFunction }) function LoadFunction() { obj.html('<img src="https://www.jb51.net/Images/loading02.gif" />'); } function erryFunction() { obj.html('error'); } function succFunction(tt) { obj.html(''); obj.html(tt); } } </script> </head> <body> <form runat="server"> <div> <table> <tr><td>姓名</td><td>语文</td><td>数学</td><td>英语</td></tr> <tr><td>张三</td> <td title="点击查询" data-value="1">查询</td> <td title="点击查询" data-value="2">查询</td> <td title="点击查询" data-value="3">查询</td></tr> </table> </div> </form> </body> </html>
<%@ WebHandler Language="C#" %> using System; using System.Web; using System.Web.SessionState; //Handler.ashx public class Handler : IHttpHandler, IRequiresSessionState { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string queryType = context.Request["queryType"]; string queryValue = context.Request["queryValue"]; if (context.Session["preQuery"] == null) //第一次查询 { context.Session["preQuery"] = queryValue + "@" + DateTime.Now.AddDays(-1); context.Session["currQuery"] = queryValue + "@" + DateTime.Now; } else //存在上次查询 { string[] preStrs = context.Session["currQuery"].ToString().Split('@'); context.Session["preQuery"] = queryValue + "@" + preStrs[1]; //重置为当前查询参数+上次查询时间 context.Session["currQuery"] = queryValue + "@" + DateTime.Now; } string[] strs=context.Session["preQuery"].ToString().Split('@'); if (strs[0] == queryValue) //同一请求限制查询间隔 { DateTime preTime = Convert.ToDateTime(strs[1]); DateTime nowTime = DateTime.Now; bool flag = CheckQueryTimeSpan(preTime, nowTime, 3); if (flag) { context.Response.Write("查询间隔3秒"); } else { context.Response.Write("98"); } } context.Response.End(); } /// <summary> /// 判断本次查询和上次查询间隔是否小于指定秒数 /// </summary> /// <param>上次查询时间</param> /// <param>本次查询时间</param> /// <param>指定秒数</param> /// <returns></returns> public bool CheckQueryTimeSpan(DateTime preTime, DateTime nowTime, int timeSpan) { TimeSpan ts = nowTime - preTime; int difference = ts.Seconds; bool flag = (difference < timeSpan) ? true : false; return flag; } public bool IsReusable { get { return false; } } }
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jquery中Ajax用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》