Ajax jquery抓取

Question

我想知道如何將Ajax整合到我的PHP代碼中來動態加載內容。

目前它是這樣的。 首先用戶選擇一個類別：

<li><a href='?genre=sport'>Sport</a></li> 

這反過來又觸發include.php文件的一部分：

if(isset($_GET['genre'])) 
{ 
    $genre=$_GET['genre']; 
} 
$result=mysqli_prepare($connection,'SELECT * FROM songs WHERE genre=?'); 
    mysqli_stmt_bind_param($result,'s',$genre); 
    mysqli_stmt_execute($result); 
    mysqli_stmt_bind_result($result,$id,$title,$artist); 

最終導致某種形式的一個HTML格式的渲染結果：

while(mysqli_stmt_fetch($result)) 
{ 
    echo $id; echo $title, echo $artist; 
} 

我知道我可能會將GET JSON數據發送到$ .ajax上，然後通過服務器上的mysqli檢索它並運行它。 我想知道什麼是最好的辦法來獲取數據返回到HTML和如何將其放置在某種重複結構。 我似乎無法得到我的頭。謝謝。

Answer 1

如果你不使用純阿賈克斯，你可能會看到xajax。你可以使用下面的代碼來模擬你的情況;

<?php 
include './path/to/xajax.inc.php'; 

$xajax = new xajax(); 

$xajax->register(XAJAX_FUNCTION, 'getGenre'); 

$xajax->processRequest(); 

function getGenre($a, $b) 
{ 
    $response = new xajaxResponse(); 
    // your db code here 
    $response->assign('result', 'innerHTML', $result); 
    return $response; 
} 

HTML：

<li><a href='?genre=sport' onclick="getGenre('sport')">Sport</a></li> 

<div id="result"></div> 

簡單地說，js和PHP函數是同步的。

不過，我建議你使用jQuery爲你的情況

編輯：

如果你想不做到這一點與正常的阿賈克斯，我可以建議你使用jQuery的模板。

在php方面;

<?php 
if(isset($_GET['genre'])) 
{ 
    $genre=$_GET['genre']; 
} 
$result=mysqli_prepare($connection,'SELECT * FROM songs WHERE genre=?'); 
mysqli_stmt_bind_param($result,'s',$genre); 
mysqli_stmt_execute($result); 
mysqli_stmt_bind_result($result,$id,$title,$artist); 

#arr = array(); 

while (mysqli_stmt_fetch($result)) { 
    $arr[] = $id; 
} 

return json_encode($arr); 

好的，你已經返回json，讓我們在js端渲染它; 讓說你的HTML像下面

<ul id="result"><ul> 

和JavaScript

$("a").on("click", function() { 
    $.getJSON("your.php" + $(this).attr("href"), function(data) { 
     var template = "<li><b>${id}</b> <b>${title}</b> <b>${artist}</b></li>"; 

     $.template("yourTemplate", template); 
     $.tmpl("yourTemplate", data) 
      .appendTo("#result"); 
    }); 
}); 

有關jQuery的模板詳情請參照here