传智ajax实现赞和踩
(1)html页面中javascript代码发出请求到一般处理程序ZanCai.ashx,
<head>
<title></title>
<script type="text/javascript" src="js/ajax.js"></script>
<script type="text/javascript">
function zan()
{
var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); //创建XMLHTTP对象，考虑兼容性。XHR
xmlhttp.open("POST", "ZanCai.ashx?action=Zan", true); //“准备”向服务器的GetDate1.ashx发出Post请求（GET可能会有缓存问题）。这里还没有发出请求
//DRY：不要复制粘贴代码
//AJAX是异步的，并不是等到服务器端返回才继续执行
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState == 4) //readyState == 4 表示服务器返回完成数据了。之前可能会经历2（请求已发送，正在处理中）、3（响应中已有部分数据可用了，但是服务器还没有完成响应的生成）
{
if (xmlhttp.status == 200) //如果Http状态码为200则是成功
{
//alert(xmlhttp.responseText);
document.getElementById("ZanCount").innerHTML = xmlhttp.responseText; //responseText为服务器端返回的报文正文
}
else
{
alert("AJAX服务器返回错误！");
}
}
}
//不要以为if (xmlhttp.readyState == 4) {在send之前执行！！！！
xmlhttp.send(); //这时才开始发送请求。并不等于服务器端返回。请求发出去了，我不等！去监听onreadystatechange吧！
}
function cai()
{
ajax("ZanCai.ashx?action=Cai", function (resText)//resText是ajax请求的返回值
{
document.getElementById("CaiCount").innerHTML = resText;
});
}
</script>
</head>
(2)封装好的ajax请求函数：
function ajax(url, onsuccess)//onsuccess是请求得到正确响应后执行的事件，该事件的具体执行由调用ajax()函数时指定
{
var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); //创建XMLHTTP对象，考虑兼容性。XHR
xmlhttp.open("POST", url, true); //“准备”向服务器的GetDate1.ashx发出Post请求（GET可能会有缓存问题）。这里还没有发出请求
//DRY：不要复制粘贴代码
//AJAX是异步的，并不是等到服务器端返回才继续执行
//注册事件onreadystatechange监听，会被调用多次
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState == 4) //readyState == 4 表示服务器返回完成数据了。之前可能会经历2（请求已发送，正在处理中）、3（响应中已有部分数据可用了，但是服务器还没有完成响应的生成）
{
if (xmlhttp.status == 200) //如果Http状态码为200则是成功
{
onsuccess(xmlhttp.responseText); //onsuccess（）是事件执行的具体函数，返回的内容xmlhttp.responseText
}
else
{
alert("AJAX服务器返回错误！");
}
}
}
//不要以为if (xmlhttp.readyState == 4) {在send之前执行！！！！
xmlhttp.send(); //这时才开始发送请求。并不等于服务器端返回。请求发出去了，我不等！去监听onreadystatechange吧！
}
public class ZanCai : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string action = context.Request["action"];
if (action == "Zan")
{
SqlHelper.ExecuteNonQuery("Update T_ZanCai set ZanCount=ZanCount+1");
int zanCount = (int)SqlHelper.ExecuteScalar("select top 1 ZanCount from T_ZanCai");
context.Response.Write(zanCount);//返回数量值，局部刷新
}
else
{
SqlHelper.ExecuteNonQuery("Update T_ZanCai set CaiCount=CaiCount+1");
int caiCount = (int)SqlHelper.ExecuteScalar("select top 1 CaiCount from T_ZanCai");
context.Response.Write(caiCount);
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
