Thư viện tri thức trực tuyến
Kho tài liệu với 50,000+ tài liệu học thuật
© 2023 Siêu thị PDF - Kho tài liệu học thuật hàng đầu Việt Nam
Thư viện JavaScript mã nguồn mở prototype.js
Nội dung xem thử
Mô tả chi tiết
Thư viện JavaScript mã nguồn mở prototype.js
Chào các bạn hôm nay mình sẽ lấy các ví dụ quen thuộc để viết lại bằng cách sử dụng Prototype –
Thư viện viện JavaScript mã nguồn mở phổ biến hiện nay, bạn có thể tìm hiểu và download
Prototype tại http://prototypejs.org/assets/2007/1/18/prototype.js
Ví dụ 1: Lấy dữ liệu từ Ajax
1. Tạo tập tin noidung.php như sau:
<?php
print("Đây là nội dung cần hiển thị");
?>
2. Tạo tập tin getData.html như sau:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> Prototype 1 </title>
<script src="prototype.js"> </script>
<script>
var id;
function ajaxLoad(sURL, sID, sPARS ) {
var url = sURL;
id = sID;
var pars = sPARS;
$(id).innerHMTL = 'Loading...';
var myAjax = new Ajax.Request(
url,
{
method: 'get',
parameters: pars,
onComplete: showResponse
});
}
function showResponse(transport) {
$(id).innerHTML = transport.responseText;
}
</script>
</head>
<body>
<div id="hienthi"> Nội dung của file noidung.php sẽ hiển thị ở đây </div>
<script> ajaxLoad('noidung.php','hienthi',''); </script>
</body>
</html>
3. Ghi chú:
* Đừng quên copy tập tin prototype.js vào cùng thư mục với 2 tập tin trên.
** Kiểm tra tập tin noidung.php xem có chạy trên máy tính của mình được không
*** Trong trường hợp nội dung cần hiển thị của trang noidung.php đòi hỏi phải có ID cho từng mẫu
tin ví dụ: noidung.php?id=001, thì bạn chỉ cần truyền tham số cho hàm ajaxLoad như sau:
<script> ajaxLoad('noidung.php','hienthi','id=001'); </script>