CommentsTest.html代码：

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <script src="jquery-1.8.3.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

            $.ajax({

                type: "post", url: "CommentsTest.ashx", data: { action: 'loadMsgs' },

                success: function (data) {

                    for (var i = 0; i < data.length; i++) {

                        var msg = data[i];

                        $("#ulMsgs").append($("<li>发表日期：" + msg.CreateDateTime + "；IP地址：" + msg.IP + "；消息：" + msg.Msg + "</li>"));

                    }

                },

                error: function () { alert("请求错误"); }

            });

            $("#btnPost").click(function () {

                var msg = $("#txtMsg").val();

                $.ajax({

                    type: "post", url: "CommentsTest.ashx", data: { msg: msg, action: 'post' },

                    success: function (data) {

                        if (data.Status == "ok") {

                            //alert("发表成功");

                            $("#ulMsgs").append($("<li>发表日期：刚刚；IP地址：本机；消息：" + msg + "</li>"));

                            $("#txtMsg").val("");

                        }

                        else if (data.Status == "error") {

                            alert(data.Msg);

                        }

                    },

                    error: function () { alert("请求错误"); }

                });

            });

        });

    </script>

</head>

<body>

    <ul id="ulMsgs">

    </ul>

    <br />

    <textarea id="txtMsg" cols="50" rows="5"></textarea><br />

    <input type="button" id="btnPost" value="发表" />

</body>

CommentsTest.ashx代码：

public void ProcessRequest(HttpContext context)

{

    context.Response.ContentType = "application/json";

    string action = context.Request["action"];

    if (action == "loadMsgs")

    {

        DataTable dt =  SQLHelper.ExecuteReader("select * from T_Comments");

        List<Object> list = new List<object>();

        foreach (DataRow row in dt.Rows)

        {

            string msg = (string)row["Msg"];

            DateTime createDT = (DateTime)row["CreateDateTime"];

            string ip = (string)row["IP"];

            //JavaScriptSerializer在序列化DateTime的时候序列化出的东西不好看，可以在服务器端ToString()转换为字符串

            //也可以在浏览器端，使用JS把/DATE\(203377733)/转换为字符串格式

            list.Add(new { Msg = msg, CreateDateTime = createDT.ToString(), IP = ip });

        }

        context.Response.Write(new JavaScriptSerializer().Serialize(list));

    }

    else if (action == "post")

    {

        string msg = context.Request["msg"];

        string ip = context.Request.UserHostAddress;

        SQLHelper.ExecuteNonQuery("insert into T_Comments(Msg,CreateDateTime,IP) values(@Msg,@CreateDateTime,@IP)",

                new SqlParameter("@Msg", msg), new SqlParameter("@CreateDateTime", DateTime.Now),

                new SqlParameter("@IP", ip));

        context.Response.Write(new JavaScriptSerializer().Serialize(new { Status = "ok", Msg = "发表成功" }));

    }

    else

    {

        throw new Exception("action错误");

    }

}

案例(JQuery的ajax无刷新评论)的更多相关文章

  1. ajax无刷新评论示例

    下面就为大家带来一篇 ajax无刷新评论示例.学习还是有点帮助的,给大家做个参考吧. 这是留言板的界面,当用户点击提交留言的时候,自动提交到我的留言下面 留言内容中为空,或者为灰色的“没有填写留言内容 ...

  2. Ajax：后台jquery实现ajax无刷新删除数据及demo

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA8gAAAFSCAIAAAChUmFZAAAgAElEQVR4nO29z4scWZbn2/+Hb30zi8

  3. jquery 的ajax无刷新上传文件之后，页面还是会莫名的刷新-----解决办法

    文件上传用到全局数组: $_FILES 只需要把下面的 <button onclick="post()">提交</button> 改为 <input ...

  4. jQuery.form Ajax无刷新上传错误 (jQuery.handleError is not a function) 解决方案

    今天,随着ajaxfileupload时间firebug财报显示,"jQuery.handleError is not a function"错误.因为一旦使用jQuery.for ...

  5. JQUERY AJAX无刷新异步上传文件

    AJAX无刷新上传文件并显示 http://blog.csdn.net/gao3705512/article/details/9330637?utm_source=tuicool jQuery For ...

  6. jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...

  7. JS---案例：无刷新评论---属于创建对象的案例拿出来复习

    案例:无刷新评论---属于创建对象的案例拿出来复习 创建行和单元格,添加到相应元素中,设置内容 createElement, appendChild,innerHTML <!DOCTYPE ht ...

  8. jQuery 无刷新评论

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. JQuery 实现页面无刷新

    对于JQuery实现页面无刷新的效果,即:应用这个JQuery这个组件,可以实现在页面上加载数据库中的数据信息,但是并没有给用户页面刷新的感觉,这样既可以有效的进行数据交互,也可以不妨碍用户的其他操作 ...

随机推荐

  1. POJ3259Wormholes（判断是否存在负回路）

    Wormholes Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 38300   Accepted: 14095 Descr ...

  2. IbatisNet的介绍和使用

    http://dragonsuc.cnblogs.com/archive/2006/07/04/ibatisnet.html IbatisNet的介绍和使用http://files.cnblogs.c ...

  3. Socket网络编程（2）--服务端实现

    中秋了,首先祝大家中秋快乐,闲着无事在家整一个socket的聊天程序,有点仿QQ界面,就是瞎折腾,不知道最后是不是能将所有功能实现. 如果你对socket不了解,请看这篇文章:http://www.c ...

  4. c/c++指针

    指针主要分: 指向单一的某个对象/变量, 用于多态或函数指针, 这个不难 - 一级指针 其次是指向数组, 用来操作/遍历数组元素 - 一级/二级指针 指向数组的一级指针很简单了: p指向的是数组的元素 ...

  5. JQ系列：css操作

    JQ中的 .css()有三种使用方法: $('#p').css('width'); 取得ID为p的样式属性的width值;等同 return width $('#p').css('width','10 ...

  6. IE7 -- 鼠标移入显示下拉框 不显示的问题 / 以及宽度问题

    这个问题,真的是打击到我了,我一度不相信自己无法解决这个问题.但是我就是真的没有解决. 那么问题解决方案是: 第一 祖先级别有一个相对定位,父级再有一个定位,那么绝对定位显示出来的元素就会不显示. 第 ...

  7. excel插入当前时间快捷键Ctrl+；

    之前写了一篇editplus如何插入当前时间_Ctrl+D的文章,有的同学说excel用习惯了,那在这我们就说一下excel插入当前时间快捷键,让您在excel快速插入当前时间 excel插入当前时间 ...

  8. Android软键盘隐藏，遮挡EidtText解决办法

    一.自动弹出软键盘 Timer timer=new Timer(); timer.schedule(new TimerTask() { public void run() { InputMethodM ...

  9. Android的webview加载本地html、本apk内html和远程URL

    //打开本包内asset目录下的index.html文件 wView.loadUrl(" file:///android_asset/index.html "); //打开本地sd ...

  10. Encapsulation and Requiring Files

    By encapsulating all the logic for an object, whether it’s a Dog or a User or an IceCreamShop, you a ...