
從JavaScript 呼叫PHP 函數
簡介
從JavaScript 執行PHP 函數可讓您存取您的網路伺服器端功能應用程式.這對於動態內容和互動式使用者介面特別有用。
AJAX 的作用
這個問題的核心解決方案在於 AJAX(非同步 JavaScript 和XML)。 AJAX 支援客戶端(瀏覽器)和伺服器之間的非同步通信,允許 JavaScript 向伺服器端 PHP 腳本發送請求並接收回應,而無需重新載入整個頁面。
實作
使用純JavaScript
使用純JavaScript 執行PHP 函數JavaScript,依照下列步驟函數操作:
-
建立XMLHTTPRequest物件,與伺服器建立連線。
-
設定請求參數,例如 PHP 腳本的 URL 和方法(通常是 GET 或POST)。
-
附加事件處理程序以在請求完成後處理回應。
-
使用 send() 將請求傳送到伺服器) 方法。
範例程式碼:
1 2 3 4 5 6 7 8 9 10 11 12 13 | function getOutput() {
var request = new XMLHttpRequest();
request.open( "GET" , "myAjax.php?query=hello" , true);
request.onload = function () {
if (request.status === 200) {
var output = document.getElementById( "output" );
output.innerHTML = request.responseText;
} else {
}
};
request.send();
}
|
登入後複製
使用JavaScript 程式庫
jQuery使用者友善的介面來簡化AJAX 操作。例如:
1 2 3 4 5 6 7 8 9 10 11 12 | function getOutput() {
$.ajax({
url: "myAjax.php" ,
data: {query: "hello" },
success: function (response) {
$( "#output" ).html(response);
},
error: function () {
}
});
}
|
登入後複製
伺服器端 (PHP)
在伺服器端建立一個 PHP 腳本來處理請求並傳回所需的輸出:
1 2 3 4 5 | <?php
$query = $_GET [ "query" ];
echo "Output for query: " . $query ;
?>
|
登入後複製
嘗試一下Out
要測試實現,請將 JavaScript 程式碼整合到您的 HTML 文件中:
1 2 3 4 | <html>
<body>
<a href= "#" onclick= "getOutput(); return false;" >Test</a>
<div>
|
登入後複製
以上是如何使用 AJAX 從 JavaScript 呼叫 PHP 函數?的詳細內容。更多資訊請關注PHP中文網其他相關文章!