Ajax는 새로 고침 없이 페이징을 실현합니다.-PHP 튜토리얼-php.cn

집

백엔드 개발

PHP 튜토리얼

Ajax는 새로 고침 없이 페이징을 실현합니다.

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Aug 08, 2016 am 09:30 AM

ajax get html nbsp url

일반적인 페이징에서는 페이지 번호가 변경되면 URL이 변경되고 전체 페이지가 새로 고쳐집니다. 페이지 번호 변경이 전체 웹 페이지의 변경에 영향을 미치지 않도록 하려면 다음을 수행합니다. 아약스 기술을 사용합니다.

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>

로그인 후 복사

페이징 클래스에서는 하이퍼링크의 주소만 변경하고 원래 주소를 변경하여 js를 통해 f1() 메서드를 호출한 후 링크를 f1() 메서드에 전달하면 됩니다. js에서.

~ 🎜>
또한 json을 사용하면 새로 고침 효과 없이 페이징을 달성할 수 있습니다. ajax와 비교하여 json은 클라이언트에 html과 css를 모두 작성하므로 서버 대역폭이 절약되고 사용자 요청 속도가 빨라집니다. 자세한 내용은 없습니다.

위 내용은 내용의 측면을 포함하여 Ajax 비새로고침 페이징 구현을 소개합니다. PHP 튜토리얼에 관심이 있는 친구들에게 도움이 되기를 바랍니다.

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.