文章/答案/技术大牛

发布

问JQuery动态加载本地文件
EN

Stack Overflow用户

提问于 2012-03-16 05:22:39

回答 2查看 7K关注 0票数 1

我正在开发一个HTML原型，页面中的所有静态内容都保存在不同的文件中。我想在我的HTML原型中使用这些文件。下面是调用这两个HTML包含文件的HTML代码。

<div class="include-file" file="header.html"></div>
<div class="include-file" file="footer.html"></div>

我使用jquery load()方法来包含这些文件。

$(function () {
    var fileName = $(".include-file").attr('file');
     $(".include-file").load(fileName);
});

当我在一个页面中只包含一个文件时，这个函数工作得很好。

问题：

1.当我包含两个文件时，第二个文件(footer.html)不会加载，第一个文件(header.html)加载两次。

2.单个文件加载在FF、IE9中有效，但在Chrome中不起作用。(注意:所有文件都是本地文件，我不打算使用web服务器，因为这只是一个原型)

jquery

load

回答 2

Stack Overflow用户

发布于 2012-03-16 05:25:50

您在每个.load上使用相同的文件名。尝试下面这样的方法，

$(function () {
    $(".include-file").each (function () {
       $(this).load($(this).attr('file'));
     });
});

这应该可以解决您的第一个问题。

尝试使用Ways to circumvent the same-origin policy解决您的第二个问题。

票数 5

Stack Overflow用户

发布于 2012-03-16 05:27:49

$(".include-file").load(fileName);

此行为所有元素加载，选择器为"include-file“类，对这两个元素也是如此。

编辑:也许你也可以使用以下代码(未测试)

$('div[file="'fileName'"').load(fileName);

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/9728371

复制

相似问题

问JQuery动态加载本地文件
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JQuery动态加载本地文件EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JQuery动态加载本地文件
EN