C# 中创建新的 ASP.NET 项目,再添加引用 AJAX.dll 文件。唯一的额外配置步骤是在 <system.web> 元素中(位于 web.config 文件中)添加以下代码。
<configuration> <system.web> <httpHandlers> <!-- Register the ajax handler --> <add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" /> </httpHandlers> ... ... </system.web> </configuration>
为了使服务器端函数在 JavaScript 中可用,必须做两件事情。首先,要使用的函数必须标有 Ajax.AjaxMethodAttribute。其次,在页加载事件期间,必须通过调用 Ajax.Utility.RegisterTypeForAjax 来注册包含这些函数的类
以下是我用ajax.net实现的无刷新评论。
效果查看地址:http://www.e-works.net.cn/report/hot2010/hot.htm
页面用到的js如下:
<script language="JavaScript" type="text/javascript">
function showaddpl(str,infoid)
{
var comment=document.getElementById(str);
var pl=document.getElementById('pl_'+infoid)
if(comment.innerHTML=="")
{
comment.innerHTML=_010SmpdVote.ShowComment(infoid).value;
comment.innerHTML+="<div class=/"mood_reply_box clear/"><div><dl class=/"clearfix/"><dt>用户名</dt><dd><input name=/"textfield/" type=/"text/" id=/"textfield_"+str+"/" style=/"width:180px;border:1px solid #F2908E/" /></dd></dl></div><div><dl class=/"clearfix/"><dt>评论内容</dt><dd><textarea class=/"tcss/" id=/"TextBox_"+str+"/" style=/"width:500px;border:1px solid #F2908E;cursor:text;font-size:12px;padding:1px 2px;/"></textarea></dd></dl></div><div class=/"ok clear/"><span style=/"padding: 3px 5px;background:#740315;border:1px solid #F2908E;color:#fff/" onmouseover=/"this.style.cursor='pointer'/" onclick=/"addpl('"+str+"','"+infoid+"')/">提交</span></div></div>";
pl.innerHTML='『收起评论』';
}
else
{
pl.innerHTML='『发表及查看评论』';
comment.innerHTML="";
}
}
function showpl(str,infoid)
{
var comment=document.getElementById(str);
comment.innerHTML=_010SmpdVote.ShowComment(infoid).value;
}
function addpl(str,infoid)
{
var txtContent = document.getElementById("TextBox_"+str+"").value; //文本框输入内容
if (txtContent == "") alert('请填写评论内容!');
else
{
var username=document.getElementById("textfield_"+str+"").value;
var result=_010SmpdVote.InsertComment(infoid,username,txtContent).value;
alert(result);
showpl(str,infoid);
}
}
function vote(id,str)
{
var tpcount=_010SmpdVote.Vote(id).value;
var countstr=document.getElementById(str);
countstr.innerHTML=tpcount;
alert('OK!');
}
</script>
主要的cs代码如下:
注意:1、需要在Page_Load中加上Ajax.Utility.RegisterTypeForAjax(typeof(_010SmpdVote));
其中_010SmpdVote是页面类的名字。
下面是在页面显示参加投票和评论的奖项:
private void ShowInfo(string type)
{
DataTable dt = Smpd.GetAppraisalListNoPage(int.Parse(type));
StringBuilder sb = new StringBuilder("");
string htmlurl = "";
string imgfile = "";
string voteinfo = "";
//sb.Append("<div class=/"hot_list/">");
for (int i = 0; i < dt.Rows.Count; i++)
{
imgfile = dt.Rows[i]["imghtmlurl"].ToString();
htmlurl = dt.Rows[i]["link"].ToString().Replace("http://articles.e-works.net.cn", "");
int n = i + 1;
sb.Append("<dl class=/"clearfix/">");
sb.Append(" <dt><strong><i>" + n + "</i></strong>");
sb.Append("<a target=/"_blank/" href=/"" + dt.Rows[i]["link"].ToString() + "/">" + dt.Rows[i]["titlt"].ToString() + "</a>");
sb.Append("<span onmouseover=/"this.style.cursor='pointer'/" onclick=/"vote('" + dt.Rows[i]["id"].ToString() + "','count_"+i+"');/"> 顶 </span>");
sb.Append("<span id=/"count_"+i+"/" style=/"font-family: Verdana,Arial,Helvetica,sans-serif; font-size:16px; color: rgb(255, 0, 0);/">").Append(dt.Rows[i]["dccount"].ToString()).Append("</span>");
//sb.Append("<span style=/"color:#000;/">『<a href=/"ShowComment.aspx?htmlurl=" + htmlurl + "&id=" + dt.Rows[i]["id"].ToString() + "/" target=/"_blank/">查看评论</a>』</span>");
sb.Append("<span id=/"pl_" + dt.Rows[i]["id"].ToString() + "/" onmouseover=/"this.style.cursor='pointer'/" onclick=/"showaddpl('hot_" + i + "','" + dt.Rows[i]["id"].ToString() + "')/" style=/"color:#000;/">『发表及查看评论』</span></dt>");
sb.Append("<dd class=/"fL pr10/">");
sb.Append("<a target=/"_blank/" href=/"" + dt.Rows[i]["link"].ToString() + "/">");
sb.Append("<img src=/"" + imgfile + "/" border=/"0/" width=/"127/" height=/"95/"></img></a>");
sb.Append("</dd>");
voteinfo = dt.Rows[i]["info"].ToString();
voteinfo = commonuse.CutString(280, voteinfo);
sb.Append("<dd><a target=/"_blank/" href=/"" + dt.Rows[i]["link"].ToString() + "/">" + voteinfo + "</a>");
sb.Append("<a target=/"_blank/" href=/"" + dt.Rows[i]["link"].ToString() + "/">");
sb.Append("<span style=/"color:#FF0000/">详细内容 >></span></a></dd>");
sb.Append("<dd><div class=/"mood_reply clear/" id=/"hot_"+i+"/">");
sb.Append("</div></dd></dl>");
}
下面是几个Ajax方法,都是被页面javascript调用的方法,注意要想方法能被前台js调用,必须在方法前加[Ajax.AjaxMethod()]
//投票方法
[Ajax.AjaxMethod()]
public int Vote(int id)
{
Smpd.Vote(id.ToString(),42, "", "", "", "", "", "", "", "", "", "", "", "");
return Smpd.GetInfoVoteNum(id);
}
//发表评论的方法
[Ajax.AjaxMethod()]
public string InsertComment(int id,string username,string content)
{
Smpd.InsertComment(id, username, content, 1);
return "评论成功!";
}
//无刷新显示评论的方法
[Ajax.AjaxMethod()]
public string ShowComment(int id)
{
StringBuilder sb = new StringBuilder("");
DataTable dt = Smpd.GetCommentList(id, 1);
if (dt.Rows.Count > 0)
{
for (int n = 0; n < dt.Rows.Count; n++)
{
string username = "匿名用户";
if (dt.Rows[n]["username"].ToString() != "")
username = dt.Rows[n]["username"].ToString();
sb.Append("<div class=/"mood_box_table/">");
sb.Append("<dl class=/"clearfix/"><dt class=/"img clearfix/">");
sb.Append("<div class=/"mood_authorname fL/">" + username + " </div>");
sb.Append("<div class=/"mood_comment_last fL/"><span class=/"gray/">");
sb.Append(dt.Rows[n]["addtime"].ToString());
sb.Append("</span></div></dt>");
sb.Append("<dd class=/"commentcont/">" + dt.Rows[n]["info"] + " </dd>");
sb.Append("</dl></div>");
}
}
return sb.ToString();
}