php - AJAX:打开另一个div中的内容

Question

我正在一个网站上使用 AJAX，目前正在制作一些页面来加载到某个 div:“pageContent”。现在我有另一个内容想要在另一个 div 上打开:“reproductor”。我想在“pageContent”div 中打开“page”，在“reproductor”div 中打开“play”。我不知道如何修改我的 script.js 和 load_page.php 文件以使其正常工作。这是我得到的:

<子>HTML:

<script type="text/javascript" src="js/script.js"></script>
<a href="#page1">PAGE</a>
<a href="#play1">PLAY</a>
<div id ="pageContent"></div>
<div id="reproductor"></div>

_脚本.js:

var default_content="";
$(document).ready(function(){

    checkURL();
    $('ul li a').click(function (e){
        checkURL(this.hash);
    });

    default_content = $('#pageContent').html();
    setInterval("checkURL()",250);

});

var lasturl="";
function checkURL(hash)
{
    if(!hash) hash=window.location.hash;

    if(hash != lasturl)
    {
        lasturl=hash;
        if(hash=="")
            $('#pageContent').html(default_content);
        else
        loadPage(hash);
    }
}

function loadPage(url)
{
    url=url.replace('#page','');
    $('#loading').css('visibility','visible');
    $.ajax({
        type: "POST",
        url: "load_page.php",
        data: 'page='+url,
        dataType: "html",
        success: function(msg){
            if(parseInt(msg)!=0)
            {
                $('#pageContent').html(msg);
                $('#loading').css('visibility','hidden');
            }
        }   
    });
}

_{load_page.php:}

<?php

if(!$_POST['page']) die("0");

$page = (int)$_POST['page'];

if(file_exists('pages/page_'.$page.'.html'))
    echo file_get_contents('pages/page_'.$page.'.html');
else 
    echo 'There is no such page!';
?>

我忘了提及:我的“页面”内容位于名为“页面”的文件夹中，而“播放”内容位于另一个名为“播放”的文件夹中。 感谢您的帮助!

Answer 1

将提供 HTML 的资源中的内容加载到元素中的最简单方法是使用 load:

$('#reproductor').load('public_html/plays/play_1.html', function(){
    //stuff to do after load goes here
});

您还可以将此技术应用于您尝试将内容加载到的其他 div。