Ajax无刷新评论

 

今天在优酷看了一个军情观察室,顺便发一个评论,感觉在优酷发评论用户体验很好,无刷新发表评论,今天用了一点时候也做了一个。其实还可以做分页的,不过现在没什么时间,还有毕业论文没有弄好,没有时间作解析。只好写到这里了。主要用到prototype框架创建的一个AJAX框架。

前台代码

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>



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

    <script language="javascript" type="text/javascript" src="prototype1.6.1.js"></script>

    <script language="javascript" type="text/javascript">

    function postdata()

    {

        var name=$F("name");

        var content=$F("content");

        var postbody="name="+name+"&content="+content;

        var myAjax= new Ajax.Request("showcomment.aspx",{mothod:"post",postBody:postbody,onCreate:oncreate,onComplete:callback})

        function oncreate()

        {

            $("show").innerHTML+="<img src='loadlist.gif'/>加载中..."

        }

        

        function callback(obj)

        {

          //  alert(myAjax.transport);

            $("show").innerHTML=obj.responseText;

//            $F("show")=obj.responseText;

            

        }

    }   

    

    

    </script>

    <style>

    #show

    {

    	

    }

    #showTitle

    {

    	background-color:Silver;

    }

    

    </style>

    

    

</head>

<body onload="postdata();">

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

    <div>

    <div id="show"></div>

    <div id="post">

    <input id="name" type="text" /><br />

    <textarea id="content" cols="20" rows="2"></textarea><br />

        <input id="Button1" type="button" value="button" onclick="postdata();" />

    </div>

    

    </div>

    

    </form>

</body>

</html>

 

图示:

Ajax无刷新评论_第1张图片

 

coding: http://www.cnblogs.com/Files/yangcai/ajaxComment.rar

你可能感兴趣的:(Ajax无刷新评论)