php jquery implements news tag classification and refresh-free paging_PHP tutorial

Nowadays, jquery is used more and more widely, and the effect of tag classification + non-refresh paging has been implemented in the news section of many websites. I also tried to write one myself, and the rendering is as follows (the style can be customized according to user needs):

The implementation process will be introduced in detail below:

I have always tried to solve the problem by seeing the tricks. Three things need to be used here - tab effect plug-in and paging plug-in, and jquery's getJson request.

So I used the jquery-ui plug-in and jquery-page plug-in. The download address is now provided:

jquery_all.rar It contains 3 JS script files and 2 Style sheets: jquery-1.3.2.min.js jquery.pager.js jquery-ui-1.7.2.custom.min.js jquery-ui-1.7.2 .custom.css Page.css The html page code is as follows:

Copy the code The code is as follows: php + jquery ui + jquery pager $(document).ready(function(){ $('#tabs').tabs(); $.getJSON("ajax4.php",{ pager: 1 , count: 10 },function(json){ $("#content1").html(json[1]); $("#pager1").pager({ pagenumber: 1, pagecount: json[0], buttonClickCallback: PageClick1 }); }); $.getJSON("ajax5.php",{ pager: 1, count: 10 },function(json){ $( "#content2").html(json[1]); $("#pager2").pager({ pagenumber: 1, pagecount: json[0], buttonClickCallback: PageClick2 }); }) ; $.getJSON("ajax6.php",{ pager: 1, count: 10 },function(json){ $("#content3").html(json[1]); $("#pager3").pager({ pagenumber: 1, pagecount: json[0], buttonClickCallback: PageClick3 }); }); }); PageClick1 = function(pageclickednumber) { TestClick1(pageclickednumber); } function TestClick1(pageclickednumber) { $.getJSON("ajax4.php",{ pager: pageclickednumber, count: 10 } ,function(json){ $("#content1").html(json[1]); $("#pager1").pager({ pagenumber: pageclickednumber, pagecount: json[0], buttonClickCallback: PageClick1 }); }); } PageClick2 = function(pageclickednumber) { TestClick2(pageclickednumber); } function TestClick2(pageclickednumber) { $.getJSON("ajax5.php",{ pager: pageclickednumber, count: 10 },function(json){ $("#content2").html(json[1]); $("#pager2").pager({ pagenumber: pageclickednumber, pagecount: json[0], buttonClickCallback: PageClick2 }); }); } PageClick3 = function(pageclickednumber) { TestClick3(pageclickednumber); } function TestClick3(pageclickednumber) { $.getJSON("ajax6.php",{ pager: pageclickednumber, count: 10 } ,function(json){ $("#content3").html(json[1]); $("#pager3").pager({ pagenumber: pageclickednumber, pagecount: json[0], buttonClickCallback: PageClick3 }); }); } 2009 &lt ;/li> 2008 2007 The page made a getJson request for the three pages ajax4.php, ajax5.php, and ajax6.php. The codes of these three pages are similar. They are just the classification of years. I have not optimized the code here. In fact, it can be completely processed on the same page. Just include a parameter in the request address. ajax.php code is as follows: Copy code The code is as follows: header( "content-type:text/html;charset:utf-8"); $db = @ mysql_connect("server host address","database account","database password"); mysql_select_db("database name"); $rs=mysql_query("set names utf8"); //If the pager parameter is passed if(isset($_GET['pager']) && isset($_GET[ 'count'])) { echo GetPager($_GET['count'],$_GET['pager']); } else { echo " No parameters passed in!"; }

function GetPager($count,$pager) { $begin = start time; $end = end time; $rs=mysql_query("SELECT * FROM data table WHERE (pubdate BETWEEN $begin AND $end) ORDER BY pubdate DESC limit ".($pager-1)*$count.",".$count); while ($r=mysql_fetch_assoc($rs)) { $temp[]=$r; } $html_string=" "; foreach($temp as $k=>$v) { //Assume that the url field is the link address, title is the news title, and pubdate is the publication time $html_string.=" ".$v['title']." ".$v ["pubdate"]." "; }

$html_string.=" "; //This is news reading The number to take, it is not recommended to read too much $num=40; //The total number of news pages is rounded up $num_string=ceil($num/$count); // Here, data in JSON format is returned in the form of key-value pairs. 0 is the total number of news pages, and 1 is the spliced HTML news page $arr=array("0"=>$num_string, "1"=> $html_string); $jarr=json_encode($arr); echo $jarr; } ?> jquery_all.rar

http://www.bkjia.com/PHPjc/320905.html www.bkjia.com true http: //www.bkjia.com/PHPjc/320905.html TechArticle Now jquery is used more and more widely, and tag classification + no refresh is implemented in the news section of many websites Pagination effect. I also tried to write one myself, and the rendering is as follows (style...