tailieunhanh - Xây dựng một ứng dụng Ajax cơ bản AJAX

Asynchronous JavaScript and XML) - là một kỹ thuật môt tả cách JavaScript có thể nhận dữ liệu từ server bằng cách xử dụng đối tượng XML HTTP Request và sau đó chèn dữ liệu nầy vào website dùng DOM. Những tiến trình nầy được thực hiện đồng thời - tức là chỉ thay đổi thông tin cần được thay đổi mà không cần phải load lại toàn bộ trang. Để hiểu cách hoạt động của AJAX, chúng ta sẻ tạo một ứng dụng đơn giản bằng AJAX. Đầu tiên, chúng ta tạo một form HTML có 2 text fields:. | Xây dựng một ứng dụng Ajax cơ bản AJAX Asynchronous JavaScript and XML - là một kỹ thuật môt tả cách JavaScript có thể nhận dữ liệu từ server bằng cách xử dụng đối tượng XML HTTP Request và sau đó chèn dữ liệu nầy vào website dùng DOM. Những tiến trình nầy được thực hiện đồng thời - tức là chỉ thay đổi thông tin cần được thay đổi mà không cần phải load lại toàn bộ trang. Để hiểu cách hoạt động của AJAX chúng ta sẻ tạo một ứng dụng đơn giản bằng AJAX. Đầu tiên chúng ta tạo một form HTML có 2 text fields username và time. Ô username sẻ do người dùng điền vào và ô time sẻ được tự động điền bởi AJAX. File HTML sẻ có tên là như sau chú ý là trong đoạn code sau đây không hề có nút submit html body form name myForm Name input type text name username Time input type text name time form body html Nguyên tắc cơ bản của AJAX là đối tượng XMLHttpRequest. Các trình duyệt khác nhau sẻ có các phương thức tạo đối tượng XMLHttpRequest khác nhau. Internet Explorer sử dụng ActiveXObject trong khi các trình duyệt khác sử dụng một đối tượng JavaScript xây dựng sẵn có tên XMLHttpRequest. Để tạo đối tượng nầy mà vẫn sử dụng được cho nhiều trình duyệt khác nhauchúng ta cần sử dụng try và catch hoặc có thể dùng if - else . Bây giờ hãy cập nhật lại file với đoạn JavaScript dùng tạo ra đối tượng XMLHttpRequest html body script type text javascript function ajaxFunction var xmlHttp try . _. Firefox Opera Safari xmlHttp new XMLHttpRequest catch e Internet Explorer try xmlHttp new ActiveXObj ect Msxml2. XMLHTTP catch e try xmlHttp new ActiveXObject catch e alert Your browser does not support AJAX return false . . . script form name myForm Name input type text name username Time input type text name time form body html Giải thích đoạn code trên 1 chút đầu tiên chúng ta tạo một biến xmlHttp để giữ đối tượng XMLHttpRequest. Sau đó tạo đối tượng nầy XMLHttp new XMLHttpRequest . dĩ nhiên là dành cho e Firefox Opera và Safari. Nếu fail thì sẻ xử lý dòng