Ajax+PHP边学边练之二实例_PHP教程

<br>function checkfortasks (thedate, e){ <br>//找到页面中taskbox对应设置为可见 <br>theObject = document.getElementById("taskbox"); <br>theObject.style.visibility = "visible"; <br>//初始化taskbox位置 <br>var posx = 0; <br>var posy = 0; <br>//定位taskbox位置为鼠标位置 <br>posx = e.clientX + document.body.scrollLeft; <br>posy = e.clientY + document.body.scrollTop; <br>theObject.style.left = posx + "px"; <br>theObject.style.top = posy + "px"; <br>//设置PHP请求页面 <br>serverPage = "taskchecker.php?thedate=" + thedate; <br>//设置PHP返回数据替换位置 <br>objID = "taskbox"; <br>var obj = document.getElementById(objID); <br>//发送请求并加载返回数据 <br>xmlhttp.open("GET", serverPage); <br>xmlhttp.onreadystatechange = function(){ <br>if (xmlhttp.readyState == 4 && xmlhttp.status == 200){ <br>obj.innerHTML = xmlhttp.responseText; <br>} <br>} <br>xmlhttp.send(null); <br>} <br> <br>效果2. 当鼠标点击某日录入姓名时，系统会自动检索姓名是否存在，并可以通过选择填入姓名框中，如图： <br><img title="namecheck" style="BORDER-TOP-WIDTH: 0px; DISPLAY: inline; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px" height="368" alt="namecheck" src="http://www.bkjia.com/uploads/allimg/131016/0933255445-1.png" width="352" border="0"><br><span style="CURSOR: pointer" onclick="doCopy('code301')"><u></u></span> 代码如下:<pre class="brush:php;toolbar:false layui-box layui-code-view layui-code-notepad"><ol class="layui-code-ol"><li><br>function autocomplete (thevalue, e){ <br>//定位页面中autocompletediv（显示检索姓名的标签）的位置 <br>theObject = document.getElementById("autocompletediv"); <br>//设置为可见 <br>theObject.style.visibility = "visible"; <br>theObject.style.width = "152px"; <br>//设置检索标签位置 <br>var posx = 0; <br>var posy = 0; <br><br>posx = (findPosX (document.getElementById("yourname")) + 1); <br>posy = (findPosY (document.getElementById("yourname")) + 23); <br><br>theObject.style.left = posx + "px"; <br>theObject.style.top = posy + "px"; <br>//设定事件为键盘录入 <br>var theextrachar = e.which; <br><br>if (theextrachar == undefined){ <br>theextrachar = e.keyCode; <br>} <br>//设定加载检索名单位置 <br>var objID = "autocompletediv"; <br><br>//设定PHP请求页面，并将用户输入的姓名传值过去（同时考虑到Backspace作用） <br>if (theextrachar == 8){ <br>if (thevalue.length == 1){ <br>    var serverPage = "autocomp.php"; <br>} <br>else{ <br>    var serverPage = "autocomp.php" + "?sstring=" + thevalue.substr(0, (thevalue.length -1)); <br>} <br>} <br>else{ <br>var serverPage = "autocomp.php" + "?sstring=" + thevalue + String.fromCharCode(theextrachar); <br>} <br>//发送请求并加载返回数据 <br>var obj = document.getElementById(objID); <br>xmlhttp.open("GET", serverPage); <br>xmlhttp.onreadystatechange = function() { <br>if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { <br>    obj.innerHTML = xmlhttp.responseText; <br>} <br>} <br>xmlhttp.send(null); <br>} <br><br>文件打包下载</li><li><p></p></li><li><p align="left"><span id="url" itemprop="url">http://www.bkjia.com/PHPjc/320812.html</span><span id="indexUrl" itemprop="indexUrl">www.bkjia.com</span><span id="isOriginal" itemprop="isOriginal">true</span><span id="isBasedOnUrl" itemprop="isBasedOnUrl">http://www.bkjia.com/PHPjc/320812.html</span><span id="genre" itemprop="genre">TechArticle</span><span id="description" itemprop="description">效果1. 当鼠标放在某日上时，如果当天有备忘录，则会显示出来，如下图：  代码如下:</span></p><pre class="brush:php;toolbar:false layui-box layui-code-view layui-code-notepad"><ol class="layui-code-ol"><li>function checkfortasks (thedate, e){ //找到页面中...<p></p></li><li>                    </li></ol></pre></li></ol></pre>