使用 AJAX 将外部 PHP 加载到 Wordpress div 的简单方法答案

【问题标题】：Simple way to use AJAX to load external PHP into a Wordpress div使用 AJAX 将外部 PHP 加载到 Wordpress div 的简单方法
【发布时间】：2013-03-11 16:48:26
【问题描述】：

我正在尝试将包含它自己的样式表和脚本（html/php、html5 视频播放器 = jplayer）的完整 PHP 文件加载到我放置在 Wordpress 模板中的 div 中。

我已经看到了一些示例，说明了一些如何将元素从 Wordpress 页面加载到 div 标签中，但由于某种原因，它们对我不起作用。

到目前为止，我已经尝试过： Need some help with jQuery AJAX request loading a PHP document into a DIV Container 和 How To Load A PHP Script Using AJAX?

但是当在浏览器中加载 Wordpress 模板时，两者都没有导致外部 php 文件实际显示在 div 中。

我要加载的页面位于 Wordpress 根目录中，在它自己的目录中，其中包含所需的 css 和 js 文件（例如http://mylocaltest.com/localWordpressRoot/vizPlayer/fileToBeLoaded.php）

这是我在 Wordpress 模板页面的 div 中加载的脚本：

 <?php
 /*
  * template name: Global Headlines
  */
 global $isBlog;
 $isBlog = true;
 get_template_part('page', 'config');
 get_header(); ?>


 <div id="vizPlayer" style="left:0;top:75px;width:50%; height:90%; margin:0; padding:0; background:#000; position:fixed; z-index:51">
    <script type="text/javascript">
 function loadContent(id) {

     $.ajax({
        type: "GET",
        url: "/vizPlayer/fileToBeLoaded.php",
        dataType: 'html',
        data: {param: id},

        success: function(html){
                  $("#vizPlayer").html(html);
        },

        error: function(){
            },

        complete: function(){
        }
     });

 }                      
        </script>

 </div>

任何提示将不胜感激。提前致谢！

【问题讨论】：

标签： php jquery ajax wordpress jplayer

【解决方案1】：

如果您在 javascript 中使用绝对 url，则该 url 是相对于网络服务器的根目录的，因此：

url: "/vizPlayer/fileToBeLoaded.php"

将加载：

http://mylocaltest.com/vizPlayer/fileToBeLoaded.php

代替：

http://mylocaltest.com/localWordpressRoot/vizPlayer/fileToBeLoaded.php

您应该将本地 WordPress 根目录添加到路径中。

【讨论】：

【解决方案2】：

我已经决定使用 Object 标签（下例），但我仍然对使用上面的 AJAX 方法感兴趣！

 <div id="movieContainer" style="left:0;top:75px;width:50%; height:90%; margin:0; padding:0; background:#000; position:fixed; z-index:51">
 <object width="100%" height="100%" id="videoTut" name="videoTut" type="text/html" data="http://localtestserver.com/localTesting/vizicast/index.php">
 </object>
 </div>

【讨论】：