在前端開發中,ajax是一項非常重要的技術,通過ajax技術可以在不刷新頁面的情況下,向后臺請求數據并且將數據呈現在前端頁面中。而后臺語言php也是非常常見的一種語言,因此,本文主要介紹如何使用ajax來請求php返回數據。
首先,我們需要在前端頁面中使用ajax來請求php的數據。下面是一個基本的ajax請求:
$.ajax({ type: "GET", url: "test.php", data: { name: "John", location: "Boston" } }) .done(function( msg ) { alert( "Data Saved: " + msg ); });
上述代碼中,我們使用了jquery庫的ajax方法,并且向test.php頁面發送了一個get請求,請求的參數是{ name: "John", location: "Boston" }。當php頁面返回數據后,我們使用了done方法來處理返回結果。其中,msg代表php頁面返回的數據。
下面我們來看看如何在php頁面中返回數據。假設我們有一個getdata.php頁面,這個頁面的作用是接收前端頁面傳來的參數,并且返回一個字符串。下面是php的代碼:
<?php if($_GET["name"] && $_GET["location"]){ $name = $_GET["name"]; $location = $_GET["location"]; echo "我的名字是".$name.",我來自".$location."。"; } ?>
通過以上代碼,我們可以成功處理前端頁面傳來的參數,并且返回一個字符串。接下來,我們回到前端頁面,將返回結果呈現在頁面中。代碼如下:
$.ajax({ type: "GET", url: "getdata.php", data: { name: "John", location: "Boston" } }) .done(function( msg ) { $("p").text(msg); });
我們使用jquery庫的text方法將msg內容呈現在p標簽內。
除了返回字符串外,php頁面還可以返回json類型的數據。下面是一個例子:
<?php if($_GET["name"] && $_GET["location"]){ $name = $_GET["name"]; $location = $_GET["location"]; $arr = array("name"=>$name, "location"=>$location); echo json_encode($arr); } ?>
在這個例子中,我們將$name和$location封裝在一個數組中,并且將數組使用json_encode方法轉化為json格式字符串。接下來,我們在前端頁面中處理這個json字符串:
$.ajax({ type: "GET", url: "getdata.php", data: { name: "John", location: "Boston" } }) .done(function( data ) { var obj = JSON.parse(data); $("p").text(obj.name + "來自" + obj.location); });
在這個例子中,我們使用了json庫的parse方法將返回的json字符串轉化為javascript對象,并且使用對象的屬性來獲取想要的數據。
以上是本文關于ajax請求php返回數據的簡單介紹。通過ajax技術,我們可以方便地向php請求數據,并且在前端頁面中呈現這些數據。