Ajax+PHP Learning and Practicing Part 2 Example_PHP Tutorial

Effect 1. When the mouse is placed on a certain day, if there are memos on that day, it will be displayed, as shown below:

Copy code The code is as follows:

function checkfortasks (thedate, e){
//Find the taskbox corresponding

in the page and set it to be visible
theObject = document.getElementById("taskbox" );
theObject.style.visibility = "visible";
//Initialize taskbox position
var posx = 0;
var posy = 0;
//Position taskbox position to the mouse position
posx = e.clientX + document.body.scrollLeft;
posy = e.clientY + document.body.scrollTop;
theObject.style.left = posx + "px";
theObject. style.top = posy + "px";
//Set the PHP request page
serverPage = "taskchecker.php?thedate=" + thedate;
//Set the PHP return data replacement position
objID = "taskbox";
var obj = document.getElementById(objID);
//Send a request and load the return data
xmlhttp.open("GET", serverPage);
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send( null);
}

Effect 2. When the mouse clicks to enter a name on a certain day, the system will automatically search whether the name exists, and can fill in the name box by selection, as shown in the figure:

Copy code The code is as follows:

function autocomplete (thevalue, e){
// Position the

of the autocompletediv (the label that displays the retrieved name) in the page
theObject = document.getElementById("autocompletediv");
//Set to visible
theObject.style.visibility = "visible ";
theObject.style.width = "152px";
//Set the retrieval tag position
var posx = 0;
var posy = 0;

posx = (findPosX (document.getElementById("yourname")) + 1);
posy = (findPosY (document.getElementById("yourname")) + 23);

theObject.style.left = posx + " px";
theObject.style.top = posy + "px";
//Set the event to keyboard input
var theextrachar = e.which;

if (theextrachar == undefined){
theextrachar = e.keyCode;
}
//Set the location to load the search list
var objID = "autocompletediv";

//Set the PHP request page , and pass the name entered by the user by value (taking into account the Backspace function)
if (theextrachar == 8){
if (thevalue.length == 1){
var serverPage = "autocomp. php";
}
else{
var serverPage = "autocomp.php" + "?sstring=" + thevalue.substr(0, (thevalue.length -1));
}
}
else{
var serverPage = "autocomp.php" + "?sstring=" + thevalue + String.fromCharCode(theextrachar);
}
//Send the request and load the return data
var obj = document.getElementById(objID);
xmlhttp.open("GET", serverPage);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}

File package download

http://www.bkjia.com/PHPjc/320812.htmlwww.bkjia.comtruehttp: //www.bkjia.com/PHPjc/320812.htmlTechArticleEffect 1. When the mouse is placed on a certain day, if there are memos on that day, it will be displayed, as shown below : Copy the code as follows: function checkfortasks (thedate, e){ //Find the page...

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Combining php with XML, XSLT, and Mysql to implement code_PHP tutorialNext article：Combining php with XML, XSLT, and Mysql to implement code_PHP tutorial

Related articles

See more

• How to use cURL to implement Get and Post requests in PHP
• How to use cURL to implement Get and Post requests in PHP
• How to use cURL to implement Get and Post requests in PHP
• How to use cURL to implement Get and Post requests in PHP
• All expression symbols in regular expressions (summary)