Php+jquery Real-time display Web site online number of methods _php tips

Source: Internet
Author: User
Tags php code setinterval

This article describes the Php+jquery real-time display of the number of online Web site methods. Share to everyone for your reference. The specific analysis is as follows:

Online number of the simplest is the direct use of JS to invoke PHP, so that can show how many people visited the site, if the user does not refresh the status of the page in real time to display the number of users online, we can use jquery Ajax to achieve.

In some applications we need to dynamically display data, such as current online numbers, current total transactions, current exchange rates, and so on, front-end pages need real-time refresh to get the latest data. Here we will combine examples to introduce the use of jquery and PHP to achieve dynamic digital display effect.

This example assumes a dynamic display on the page (no need to refresh the entire page, but only local refresh dynamic numbers) The current number of online users, commonly used in some statistical platforms. You only need to define the following structure in an HTML page:

Copy Code code as follows:
<div class= "Count" > Current online: <span id= "Number" ></span></div>

First we define an animation process that uses the animate () function of jquery to implement a transform from one number to another, and the following magic_number () Custom function consolidates the code as follows:

[Code]function Magic_number (value) {
var num = $ ("#number");
Num.animate ({Count:value}, {
DURATION:500,
Step:function () {
Num.text (String (parseint (This.count)));
}
});
};


The update () function then uses jquery's $.getjson () to send an AJAX request to the background number.php, which, after getting PHP, invokes Magic_number () to show the latest numbers. To see better results, we use setinterval () to set the time interval for code execution.

Copy Code code as follows:
function Update () {
$.getjson ("number.php?jsonp=?", function (data) {
Magic_number (DATA.N);
});
};

SetInterval (update, 5000); 5 Seconds to execute once
Update ();

PHP Code section:
In the actual project, we will use PHP to get the latest data in the database and then return it to the front end via PHP. For better Demos, this example uses random numbers, and finally returns to the front end js,number.php code in JSON format as follows:
Copy Code code as follows:
$total _data = Array (
' N ' => rand (0,999)
);
echo $_get[' Jsonp ']. ' ('. Json_encode ($total _data). ')';

The principle is very simple is the use of JS settimeout to achieve a few seconds to load a PHP file to achieve real-time display online number of functions.

I hope this article will help you with your PHP programming.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.