Mô hình PHP AJAX

AJAX được sử dụng để tạo ra các ứng dụng tương tác hơn.

Mô hình PHP AJAX

Dưới đây là ví dụ minh họa: khi người dùng gõ字符 vào trường nhập liệu, trang web sẽ giao tiếp với máy chủ web như thế nào:

Mô hình

Vui lòng nhập chữ cái A-Z vào trường nhập liệu bên dưới:

Tên:

Gợi ý tìm kiếm:

Giải thích ví dụ

Trong ví dụ trên, khi người dùng gõ字符 vào trường nhập liệu, hàm "showHint()" sẽ được thực hiện.

Hàm này được kích hoạt bởi sự kiện onkeyup.

Dưới đây là mã HTML:

Mô hình

<html>
<head>
<script>
function showHint(str) {
    if (str.length == 0) { 
        document.getElementById("txtHint").innerHTML = "";
        return;
    }
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                document.getElementById("txtHint").innerHTML = this.responseText;
            }
        };
        xmlhttp.open("GET", "gethint.php?q=" + str, true);
        xmlhttp.send();
    }
}
</script>
</head>
<body>
<p><b>Bitte geben Sie den Namen im folgenden Eingabefeld ein:</b></p>
<form> 
Họ hoặc tên: <input type="text" onkeyup="showHint(this.value)">
</form>
<p>Ý kiến:</span></p>
</body>
</html>

Thử ngay

Giải thích mã:

Trước tiên, kiểm tra trường nhập có rỗng hay không (str.length == 0），nếu có, xóa nội dung của txtHint và thoát hàm.

Nhưng, nếu trường nhập không rỗng, thì thực hiện như sau:

  • Tạo đối tượng XMLHttpRequest
  • Tạo hàm sẽ được thực thi khi máy chủ sẵn sàng phản hồi
  • Gửi yêu cầu đến tệp PHP (gethint.php) trên máy chủ
  • Vui lòng thêm tham số q vào gethint.php
  • Biến str lưu trữ nội dung của trường nhập

Tệp PHP - "gethint.php"

Tệp PHP này kiểm tra danh sách tên và sau đó trả về tên tương ứng cho trình duyệt:

<?php
// Danh sách tên
 $a[] = "Ava";
 $a[] = "Brielle";
 $a[] = "Caroline";
 $a[] = "Diana";
 $a[] = "Elise";
 $a[] = "Fiona";
 $a[] = "Grace";
 $a[] = "Hannah";
 $a[] = "Ileana";
 $a[] = "Jane";
 $a[] = "Kathryn";
 $a[] = "Laura";
 $a[] = "Millie";
 $a[] = "Nancy";
 $a[] = "Opal";
 $a[] = "Petty";
 $a[] = "Queenie";
 $a[] = "Rose";
 $a[] = "Shirley";
 $a[] = "Tiffany";
 $a[] = "Ursula";
 $a[] = "Victoria";
 $a[] = "Wendy";
 $a[] = "Xenia";
 $a[] = "Yvette";
 $a[] = "Zoe";
 $a[] = "Angell";
 $a[] = "Adele";
 $a[] = "Beatty";
 $a[] = "Carlton";
 $a[] = "Elisabeth";
 $a[] = "Violet";
// Lấy tham số q từ URL
$q = $_REQUEST["q"];
$hint = "";
// Xem tất cả các hint trong mảng, $q có phải là "" không
if ($q !== "") {
    $q = strtolower($q);
    $len=strlen($q);
    foreach($a as $name) {
        if (stristr($q, substr($name, 0, $len))) {
            if ($hint === "") {
                $hint = $name;
            }
                $hint .= ", $name";
            }
         }
    }
}
// Xuất "không có gợi ý" nếu không tìm thấy hint hoặc xuất giá trị chính xác
  echo $hint === "" ? "không có gợi ý" : $hint;
?>
c.html" -->