Question

我对ajax没有多少经验，想知道是否可以使用jQuery的load（）方法+ json将外部内容加载到一堆空div中。

我有以下几点作为起点：

<div id="aboutUs"></div>
<div id="whatWeDo"></div>
<div id="ourValues"></div>
<div id="ourExpertise"></div>

var loadPages = { 'pageData' : [
    {   
        'loadInTo'      :    '#aboutUs',
        'url'           :   'http://www.website.co.uk/aboutUs.html',
        'urlSection'    :   '#aboutUs' 
    },
    {   
        'loadInTo'      :    '#whatWeDo',
        'url'           :   'http://www.website.co.uk/whatWeDo.html',
        'urlSection'    :   '#whatWeDo' 
    },
    {   
        'loadInTo'      :    '#ourValues',
        'url'           :   'http://www.website.co.uk/ourValues.html',
        'urlSection'    :   '#ourValues' 
    },
    {   
        'loadInTo'      :    '#ourExpertise',
        'url'           :   'http://www.website.co.uk/ourExpertise.html',
        'urlSection'    :   '#ourExpertise' 
    }   
] }

'loadInto'指定我希望在页面上插入html的位置，'url'是我正在加载的页面，'urlSection'是我要加载的url的一部分。

任何人都可以帮我指出正确的方向吗？非常感谢提前。

Answer 1

不知道为什么你有loadInTo和urlSection，因为它们是相同的但是你可以这样做：

for(i=0; i < loadPages.pageData.length ; i++){
    var current = loadPages.pageData[i];
    $(current.urlSection).load(current.url);
}

如果网站内容不在同一网站上，则必须使用json

http://api.jquery.com/jQuery.ajax/

请参阅crossDomain。

Answer 2

如果要加载外部内容，则需要处理跨域问题。有多种方法可以解决这个问题 - 您可能想要研究跨域ajax请求，有大量关于解决方案的文档。

您是否有任何理由从其他网址引入主机网站的内容？

对于你想要做的事情，假设你在主机上启用了类似PHP的东西，那么使用类似代理的方法是最好的。

创建一个名为'AJAboutUs.php'的php文件，并输入以下内容：

<?php
include('http://www.website.co.uk/aboutUs.html');
?>

然后使你的load（）函数引用'AJAboutUs.php' - 因为这是一个本地文件，它应该显示内容。

使用jQuery load（）和json加载外部内容

2 个答案: