在 Wordpress 中通过 XMLHttpRequest 加载数据库内容

【问题标题】：Loading database content via XMLHttpRequest in Wordpress在 Wordpress 中通过 XMLHttpRequest 加载数据库内容
【发布时间】：2013-04-14 04:49:09
【问题描述】：

我创建了一个新的 wordpress 模板页面。这个想法是，当我单击侧边栏 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>

感谢您的帮助！ :)

【问题讨论】：

标签： php wordpress get xmlhttprequest

【解决方案1】：

在 wordPress 中，您必须使用 action 进行 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
}

在你的javascript文件中也使用post而不是get这样的东西

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 上阅读更多内容。

【讨论】：