clickdemo.html:此文件包含与链接的html和ajax代码。
clicktrack.php:php返回操作信息
<body>
<a href="http://www.111cn.net" onclick="dowork(this);" >test</a>
</body>
js代码
网页特效代码是有点多,但这里只dowork(),这个函数将处理鼠标的点击,获得源和目标位置,并调用clicktrack.php更新统计信息
function dowork(element){
httpobject = gethttpobject();
if (httpobject != null) {
dst = element.href;
src = document.location.href;
httpobject.open("get", "clicktrack.php?src="+src+"&dst="+dst, true); httpobject.send(null);
httpobject.onreadystatechange = setoutput;
}}
下面看完整实例
<!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>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>ajax click tracking example</title>
<script language="javascript" type="text/javascript">
function gethttpobject(){
if (window.activexobject) return new activexobject("microsoft.xmlhttp");
else if (window.xmlhttprequest) return new xmlhttprequest();
else { alert("your browser does not support ajax.");
return null; } }
// change the value of the outputtext field
function setoutput(){ return true; } // implement business logic
function dowork(element){
httpobject = gethttpobject();
if (httpobject != null) {
dst = element.href;
src = document.location.href;
httpobject.open("get", "clicktrack.php?src="+src+"&dst="+dst, true);
httpobject.send(null);
httpobject.onreadystatechange = setoutput;
}
}
var httpobject = null; var src = null; var dst = null;</script>
</head>
<body>
<a href="http://www.111cn.net" onclick="dowork(this);" > test </a>
</body>
</html>