Trang chủ
Hướng dẫn cách thay đổi URL trong ajax, chúng ta có thể sử dụng tính năng của anchor trong HTML
ví dụ:
<a href="#php">PHP</a>
khi click vào link có anchor thì browser không load lạii nhưng URL thay đổi http://domain.com/#php <~~ thuận tiện trong ajax
Trong ajax, khi ta click vào link thì hàm ajax sẽ gưi thông tin đến file noidung.php để lấy nội dung tương ứng nhưng trong PHP không thể lấy các giá trị từ anchor (#php) nên ta phải dùng javascript để truyền tham số cho noidung.php
<script>
url = window.location.href; //link hiện tại, ví dụ: http://domain.com/#php
c_url = url.split('#');
id = c_url[1]; //tác url và lấy giá trị phía sau #, tức là php
ajaxLoad('noidung.php?id='+id,'hienthi'); // gửi dữ liệu đến file nội dung
</script>
Đây là code demo:
<html><title>PHP BASIC - AJAX SIMPLE </title>
<body>
<script>
loadstatustext = 'Loading...';
function ajaxLoad(url,id)
{
if (document.getElementById) {
var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
}
if (x)
{
x.onreadystatechange = function()
{
el = document.getElementById(id);
el.innerHTML = loadstatustext;
if (x.readyState == 4 && x.status == 200)
{
el.innerHTML = x.responseText;
}
}
x.open("GET", url, true);
x.send(null);
}
}
</script>
<div id="hienthi">Day la noi dung file can hien thi</div>
<script>
var url = window.location.href;
if(url.indexOf('#')!=-1) c_url = url.split('#');
id = c_url?c_url[1]:'#';
ajaxLoad('noidung.php?id='+id,'hienthi');
</script>
<a href="#1" onClick="ajaxLoad('noidung.php?id=1','hienthi');">1</a> <br>
<a href="#2" onClick="ajaxLoad('noidung.php?id=2','hienthi');">2</a> <br>
<a href="#3" onClick="ajaxLoad('noidung.php?id=3','hienthi');">3</a> <br>
<a href="#4" onClick="ajaxLoad('noidung.php?id=4','hienthi');">4</a> <br>
<a href="#8" onClick="ajaxLoad('noidung.php?id=8','hienthi');">8</a> <br>
<a href="#5" onClick="ajaxLoad('noidung.php?id=5','hienthi');">5</a> <br>
<a href="#6" onClick="ajaxLoad('noidung.php?id=6','hienthi');">6</a> <br>
<a href="#7" onClick="ajaxLoad('noidung.php?id=7','hienthi');">7</a>
</body>
</html>
file noidung.php
<?php
print $_GET['id'];
?>
Chúc thành công!
Tác giả:NguyÅn Minh Tân
