[Ví dụ] AJAX Loader - Tải nội dung một trang web khác vào một khung trên trang mình!. Bạn xây dựng một trang web và bạn muốn trên đó 1 khung nội dung của bạn chứa 1 trang web khác html,
Trang 1[Ví dụ] AJAX Loader - Tải nội dung một trang web khác vào một khung trên trang mình!
Bạn xây dựng một trang web và bạn muốn trên đó 1 khung nội dung của bạn chứa 1 trang web khác (html, php, xml, ) Điều này có thể thực hiện dễ dàng với thẻ iframe, nhưng nếu bạn muốn dùng AJAX để tải trang đó (tức khi hiện lên thì nó đã load 100%) bạn có thể làm như sau:
Trước hết bạn tạo 1 file ajaxLoader.js có nội dung như sau:
PHP Code:
function ajaxLoader(url,id) {
if (document.getElementById) {
var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : ne
w XMLHttpRequest();
}
if (x) {
x.onreadystatechange = function() {
if (x.readyState == 4 && x.status == 200) {
el = document.getElementById(id);
el.innerHTML = x.responseText;
}
}
x.open("GET", url, true);
x.send(null);
}
}
Bạn save cùng thư mục trang web bạn đang tạo Mở trang web bạn đang tạo lên,
Chèn đoạn code sau vào giữa <head> và </head>
PHP Code:
<script language="javascript" src="ajaxLoader.js">
</script>
<style type="text/css">
#contentLYR {
position:absolute;
width:100%; // tùy chọn
height:100%; // tùy chọn
z-index:1; // tùy chọn
left: 0px; // tùy chọn
Trang 2top: 200px; // tùy chọn
}
</style>
Tại thẻ <body> bạn khai báo như sau:
Code:
<body onload="ajaxLoader('test.htm','contentLYR')"> (Chú ý test.html là trang được load.)
Trong thẻ <body> bạn chèn:
Code:
<div id="contentLYR">
Loading
</div>
Hãy thử và cảm nhận
Ngocha85(UDS)