经过一下午写了个消息盒子的例子，用的是ajax方式轮询读取，没有用到后台自动“推”数据的方式，效果良好。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mainTalk.aspx.cs" Inherits="wj_test.Talk.mainTalk" %>

<!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></title>

    <mce:script src="../Scripts/jquery-1.4.1.js" mce_src="Scripts/jquery-1.4.1.js" type="text/javascript"></mce:script>

    <mce:style><!--

        body

        {

            font-size: 12px;

        }

        #content

        {

            width: 200px;

            height: 50px;

            border: solid 1px #dedede;

            background-color: #eee;

        }

        #news

        {

            width: 200px;

            height: 13px;

            font-weight: bold;

        }

        li

        {

            height: 16px;

            line-height: 16px;

            list-style: none;

            color: #226B19;

        }

        a

        {

            text-decoration: none;

            color: #9E3423;

        }

--></mce:style><style mce_bogus="1">        body

        {

            font-size: 12px;

        }

        #content

        {

            width: 200px;

            height: 50px;

            border: solid 1px #dedede;

            background-color: #eee;

        }

        #news

        {

            width: 200px;

            height: 13px;

            font-weight: bold;

        }

        li

        {

            height: 16px;

            line-height: 16px;

            list-style: none;

            color: #226B19;

        }

        a

        {

            text-decoration: none;

            color: #9E3423;

        }

    </style>

    <mce:script type="text/javascript"><!--

        function getData() {//获取留言数据

            var temp = "";

            $.getJSON("Data.aspx", { ID: "2", time: new Date() }, function (json) {//利用ajax返回json的方式

                if (json.length > 0) {//返回有数据

                    $("#news").html(" <font color='Red'>有新消息：</font>");

                    for (var i = 0; i < json.length; i++) {//循环json，生成需要的标签

                        temp += "<li id='" + json[i].ID + "' ><img src="../img/t.gif" mce_src="img/t.gif" style='height: 14px; width: 14px' /><a  href="#" mce_href="#" onclick='getHref(" + json[i].ID + "); return false;' >" + json[i].SendID + "给您留言了</a></li>";

                    }

                    $("#info li").remove(); //移除之前的元素li

                    $("#info").append(temp); //追加新的

                    $("li").hide(); //隐藏全部，只显示前2条

                    $("li:eq(0)").show();

                    $("li:eq(1)").show();

                }

                else {

                    $("#news").html(" <font color='#999'>无新消息：</font>"); //无数据时的提示

                }

            })

        };

        $(function () {//间隔3s自动加载一次

            getData(); //首次立即加载

            window.setInterval(getData, 3000); //循环执行！！

            }

         );

        function getHref(id) {//重定向页面并且移除当前li标签

            location.href = 'ShowAndRe.aspx?ID=' + id;

            $(document.getElementById(id)).remove();

        }

// --></mce:script>

</head>

<body>

    <form id="form1" runat="server">

    <div id="content">

        <div id="news">

        </div>

        <ul id="info" style="margin: 0 0 0 0;" mce_style="margin: 0 0 0 0;">

        </ul>

    </div>

    </form>

</body>

</html>

前台的HTML代码：

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data.SqlClient;

using System.Data;

using System.Text;

namespace wj_test.Talk

{

    public partial class Data : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            if (Request.QueryString["ID"] != null)

            {

                string id = Request.QueryString["ID"].ToString();

                SqlConnection scn = new DB().getDB();

                scn.Open();

                string str = "select * from test_talk where Station=0 and ReID="+id+" order by ID desc";

                SqlDataAdapter ada = new SqlDataAdapter(str, scn);

                DataTable dt = new DataTable();

                ada.Fill(dt);

                scn.Close();

                if (dt.Rows.Count > )

                {

                    string json = DataTable2Json(dt);

                    Response.Write(json);

                }

                else

                    Response.Write("{}");//为空时返回{} 使json对象的length=0

            }

        }

        public static string DataTable2Json(DataTable dt)

        {

            StringBuilder jsonBuilder = new StringBuilder();

            jsonBuilder.Append("[");

            for (int i = ; i < dt.Rows.Count; i++)

            {

                jsonBuilder.Append("{");

                for (int j = ; j < dt.Columns.Count; j++)

                {

                    jsonBuilder.Append("/"");

                    jsonBuilder.Append(dt.Columns[j].ColumnName);

                    jsonBuilder.Append("/":/"");

                    jsonBuilder.Append(dt.Rows[i][j].ToString());

                    jsonBuilder.Append("/",");

                }

                jsonBuilder.Remove(jsonBuilder.Length - , );

                jsonBuilder.Append("},");

            }

            jsonBuilder.Remove(jsonBuilder.Length - , );

            jsonBuilder.Append("]");

            return jsonBuilder.ToString();

        }

    }

}

后台的C#代码，获取数据：

Ajax轮询消息自动提示（消息盒子）的更多相关文章

  1. 中断、轮询、事件驱动、消息驱动、数据流驱动(Flow-Driven)？

    轮询.事件驱动.消息驱动.流式驱动 ---数据流驱动 Unidirectional Architecture? 中断.事件.消息这样一种机制来实现更好的在多任务系统里运行... 阻塞,非阻塞同步,异步 ...

  2. 闲话ajax，例ajax轮询，ajax上传文件[开发篇]

    引语:ajax这门技术早已见怪不怪了,我本人也只是就自己真实的经验去总结一些不足道的话.供不是特别了解的朋友参考参考! 本来早就想写一篇关于ajax的文章的,但是前段时间一直很忙,就搁置了,趁着元旦放 ...

  3. WebSocket和long poll、ajax轮询的区别，ws协议测试

    WebSocket和long poll.ajax轮询的区别,ws协议测试 WebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接的(长连 ...

  4. 浅谈Websocket、Ajax轮询和长连接（long pull）

    最近看到了一些介绍Websocket的文章,觉得挺有用,所以在这里将自己的对其三者的理解记录一下. 1.什么是Websocket Websocket是HTML5中提出的新的协议,注意,这里是协议,可以 ...

  5. Ajax轮询以及Comet模式—写在Servlet 3.0发布之前(转)

    2008 年的夏天,偶然在网上闲逛的时候发现了 Comet 技术,人云亦云间,姑且认为它是由 Dojo 的 Alex Russell 在 2006 年提出.在阅读了大量的资料后,萌发出写篇 blog ...

  6. WebSocket原理及与http1.0/1.1 long poll和 ajax轮询的区别【转自知乎】

    一.WebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接的(长连接,循环连接的不算)首先HTTP有1.1和1.0之说,也就是所谓的ke ...

  7. 浅谈Websocket、Ajax轮询和长轮询（long polling）

    浅谈Websocket.Ajax轮询和长轮询(long p0ll) 最近看到了一些介绍Websocket的文章,觉得挺有用,所以在这里将自己的对其三者的理解记录一下. 1.什么是Websocket W ...

  8. long poll、ajax轮询和WebSocket

    websocket 的认识深刻有木有.所以转到我博客里,分享一下.比较喜欢看这种博客,读起来很轻松,不枯燥,没有布道师的阵仗,纯粹为分享.废话这么多了,最后再赞一个~ WebSocket是出的东西(协 ...

  9. COMET探索系列二【Ajax轮询复用模型】

    写在前面:Ajax轮询相信大家都信手拈来在用,可是有这么一个问题,如果一个网站中同时有好多个地方需要用到这种轮询呢?就拿我们网站来说,有一个未读消息数提醒.还有一个时实时加载最新说说.昨天又加了一个全 ...

  10. ajax轮询原理及其实现方式

    ajax轮询原理及其实现方式 ajax轮询的两种方式 方式1:设定一个定时器,无论有无结果返回,时间一到就会继续发起请求,这种轮询耗费资源,也不一定能得到想要的数据,这样的轮询是不推荐的. 方式2: ...

随机推荐

  1. Linux 上通过binlog文件 恢复mysql 数据库详细步骤

    一.binlog 介绍 服务器的二进制日志记录着该数据库的所有增删改的操作日志(前提是要在自己的服务器上开启binlog),还包括了这些操作的执行时间.为了显示这些二进制内容,我们可以使用mysqlb ...

  2. Idea2016远程调试Java项目

    一.在IDEA中配置远程tomcat 1.打开配置页面 选择"+" → "Tomcat Server" → "Remote" 填写名称和目标 ...

  3. Web（Easy UI）

    HTML菜鸟教程 http://www.runoob.com/html/html-tables.html EasyUI combobox下拉多选框的实现 https://www.cnblogs.com ...

  4. c#中的序列化

    1.对象的序列化 NET支持对象序列化有以下几种方式:二进制序列化:对象序列化之后是二进制形式的,通过BinaryFormatter类来实现的,这个类位于System.Runtime.Serializ ...

  5. ffmpeg编译选项汇总

    编译禁用“jack” 和 “crystalhd” : --disable-crystalhd--disable-indev=jack ================================= ...

  6. IOSerialize（序列化）

    在讲序列化和反序列化之前,先来阐述文件夹/文件 检查.新增.复制.移动.删除, Directory和DirectotyInfo这两个特性主要是对文件夹进行操作 首先检测文件夹是否存在 if (!Dir ...

  7. C++Primer笔记-----day04

    1.函数指针.函数指针指向某种特定类型,函数的类型由它的返回类型和形参类型决定,与函数名无关.比如:bool lengthCompare(const string &,const string ...

  8. Linux服务管理 systemctl命令详解

    Linux服务器,服务管理--systemctl命令详解,设置开机自启动 syetemclt就是service和chkconfig这两个命令的整合     任务 旧指令 新指令 使某服务自动启动 ch ...

  9. 前端开发之CSS篇二

    主要内容: 一.CSS的继承性和层叠性 二.盒模型 三.padding属性 四.border属性 五.margin属性 六.标准文档流 七.行内元素和块状元素转换 1️⃣  CSS的继承性和层叠性 1 ...

  10. Linux实战教学笔记36：PHP服务缓存加速深度优化实践

    一,PHP缓存加速器介绍与环境准备 1.1 PHP缓存加速器介绍 1.1.1 操作码介绍及缓存原理 当客户端请求一个PHP程序时,服务器的PHP引擎会解析该PHP程序,并将其编译为特定的操作码(Ope ...