在Wordpress中通過XMLHttpRequest加載數據庫內容

Question

我創建了一個新的wordpress-template-page。這個想法是，當我點擊我的sidebar-div中的鏈接時，它應該從我的content-div中的數據庫加載內容。在一個簡單的PHP頁它的工作原理，但在我的WordPress模板的頁面組合它不工作...

這是我的代碼：（精簡版）

<?php // Template Name: Weinkarte 
get_header(); ?> 

<div id="container-sidebar"> 
    <span id="wineList"></span> 
</div> 

<div id="sidebar-right"> 
    <li><a href='#' id='1' onclick='loadWine(this.id)'>Click</a></li> 
</div> 

get_footer(); 

<script> 
function loadWine(id) 
{ 
xmlhttp=new XMLHttpRequest(); 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("wineList").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","loadWine.php?landID="+id,true); //I think here is probably the fault 
xmlhttp.send(); 
} 
</script> 

感謝您的幫助！ :)

Answer 1

在WordPress，你必須用行動爲Ajax調用，這樣的事情（基本上是你的functions.php）

add_action('wp_ajax_nopriv_myAjaxFunction', 'myAjaxFunction'); 
add_action('wp_ajax_myAjaxFunction', 'myAjaxFunction'); 
function myAjaxFunction(){ 
    //get the data from ajax call 
    $landID = $_POST['landID']; 
    // rest of your code 
} 

你還可以使用post代替get這樣的JavaScript文件

var data = "action=myAjaxFunction&landID="+id; 
xmlhttp.open("POST","http://your_site.com/wp-admin/admin-ajax.php",true); 
xmlhttp.send(data); 

給出的例子只是一個想法，你應該閱讀更多的信息並使用jQuery以方便。你可以閱讀更多關於Codex和here is another nice article。