ajax實現無刷新分頁-php教程-PHP中文網

首頁

後端開發

php教程

ajax實現無刷新分頁

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Aug 08, 2016 am 09:30 AM

ajax get html nbsp url

在普通的分頁中，一旦頁碼改變，則url改變，整個頁面都會刷新，如果我們希望頁碼的改變不影響整個網頁的變動，可以使用ajax技術。

AJAX 是一種用於建立快速動態網頁的技術。透過在後台與伺服器進行少量資料交換，AJAX 可以使網頁實現非同步更新。這意味著可以在不重新載入整個網頁的情況下，對網頁的某個部分進行更新。

透過客戶端html程式碼，用ajax把伺服器中的資料透過get方式傳遞過來，顯示在html中。

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus&#174;">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>ajax实现无刷新分页</title>
  <script type="text/javascript">
	function f1(url){
		var xhr = new XMLHttpRequest;
		xhr.onreadystatechange = function() {
			if(xhr.readyState==4){
				document.getElementById('d').innerHTML = xhr.responseText ;
			}
		}
		xhr.open("get",url);
		xhr.send(null);
	}	
	//页面加载完成后，就调用该函数
	window.onload = function(){
		f1("fenye-data.php");
	}
  </script>
 </head>
 <body>
	<h2 align=&#39;center&#39;>ajax实现无刷新分页</h2>
	<div id=&#39;d&#39;></div>
 </body>
</html>

登入後複製

rrreee

傳遞給js中的f1()方法。

進一步的，可以使用json實現無刷新效果的分頁，與ajax相比，json將html和css都寫在客戶端，從而節省了伺服器頻寬，也使用戶的請求速度加快，具體方法不再贅述。

以上就介紹了ajax實現無刷新分頁，包含了方面的內容，希望對PHP教程有興趣的朋友有所幫助。 🎜 🎜 🎜

本網站聲明

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn