首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >我正在使用javascript在另一个html页面中加载一些html页面。它在中运行良好,但在Google和IE10中不起作用。

我正在使用javascript在另一个html页面中加载一些html页面。它在中运行良好,但在Google和IE10中不起作用。
EN

Stack Overflow用户
提问于 2013-11-07 16:35:25
回答 3查看 2.6K关注 0票数 1

我为下拉菜单编写了代码,并希望将该代码插入其他html文件中。DropDown菜单代码。

http://jsfiddle.net/techspartan/49Bpb/

为了将上面的HTML代码插入到其他HTML文件中,我将使用以下代码:

代码语言:javascript
复制
  <html>
     <head>
       <script src="jquery-2.0.3.js"></script>
       <script type="text/javascript">
         $(document).ready(function(){
           $('#topdiv').load('index.html');
         });
       </script>
     </head>

    <body>
     <div id="topdiv">
     </div>
    </body>
 </html>

基本上,我想在一个位置声明我的DropDownMenu代码,这样,如果我在菜单代码中进行更改,就不必编辑每个具有DropDown的DropDown文件。

上面的代码在Firefox中运行,但Chrome和IE-10中没有显示任何代码。

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-11-07 16:43:21

您是否在您的机器上本地工作,没有任何any服务器?Chrome不允许通过AJAX从您的文件系统加载文件(请参阅布格利波特)。

您可以使用XAMPP或类似的东西通过本地via服务器服务您的文件。

如果您在Windows上,XAMPP可能是启动和运行本地way服务器的最简单方法:http://www.apachefriends.org/en/xampp.html

在Mac上,您也可以使用MAMP http://www.mamp.info/en/index.html

如果您使用--allow-file-access-from-files启动本地文件,也可以强制Chrome允许本地文件访问,这是这个堆叠溢出问题中的更多信息

票数 3
EN

Stack Overflow用户

发布于 2013-11-07 16:59:25

值得注意的是,我有一些代码使用jQuery().load()将内容注入到页面中,并且工作得很好。

如果这是静态内容,它是您页面的一个标准部分,那么其他在服务器上这样做的答案/评论可能是正确的;通常情况下,这样的内容最好包含在服务器上,因为它将使您的站点比通过Javascript加载页面时表现得更好。(实际上,以这种方式加载静态菜单可能会在用户加载页面时给站点带来明显的性能问题;请注意!)

但是,一般来说,使用Javascript向页面动态添加内容的技术是完全有效的,而且通常使用,因此我将在此基础上回答这个问题。

除了缺少一个Doctype之外,您提供的最小示例没有什么特别的错误,所以我想这可能是您的问题所在:

如果您没有doctype,浏览器将以古怪模式呈现页面。而jQuery的设计并不是为了在古怪的模式下工作。

解决方案:将以下一行添加到代码的顶部,然后再试一次:

代码语言:javascript
复制
<!DOCTYPE html>

您还可能需要检查IE是否也在兼容性模式下显示您的页面,因为这也可能会导致问题。如果是的话,您还可以向页面的<head>部分添加一个与X UA兼容的元标记,以迫使IE进入标准模式:

代码语言:javascript
复制
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

最后,如果您需要支持IE8或更早版本,则应该从jQuery v2切换到jQuery v1的最新版本(当前为1.10.2),因为jQuery v2不适用于IE8和更早版本。

希望这能有所帮助。

票数 1
EN

Stack Overflow用户

发布于 2013-11-07 17:32:31

您所遇到的问题并不是因为您的代码有任何问题,而是因为现代浏览器的安全策略。下面是在您的开发机器上发生的事情:

浏览器加载本地HTML文件。

浏览器执行javascript,它试图访问计算机上的一个文件。

你的浏览器说,“不!”因为这是一个巨大的安全错误--如果没有这个策略,网站就可以读取硬盘上的每个文件,或者默默地将任何私人信息的副本发送到它们的服务器上,仅仅是因为您访问了一个启用了javascript的站点。坏的!

有一些方法可以尝试告诉您的浏览器“不,没关系,我想允许这个.”...but,您知道,这已经变得非常困难,因为它经常悄无声息地打破新的浏览器版本。我经常把头撞在墙上,所以我建议你跳过试着让你的浏览器正常运行。

现在,为什么这个在现场工作呢?下面是发生的事。

您的浏览器加载一个网站。

浏览器执行javascript。

脚本要求从网站加载/访问文件。

你的浏览器说.“好吧,我们已经在这个网站上了,所以肯定!从那个网络服务器加载所有你想要的文件!”您的浏览器友好地获取该文件,并将其返回到您的脚本中,在那里您可以无痛地将HTML包含到您心中的内容中。

要在您的开发机器上完成这项工作,您最终有三个选择:

1)将文件上传到web服务器,然后在那里进行测试。

2)制作自己的“本地主机”web服务器。然后使用localhost/index.html之类的内容访问站点。这足以防止浏览器关闭文件加载请求,因为您请求的是HTTP操作,请注意文件操作。

3)尝试强迫浏览器允许这些请求。细节因浏览器而异,有些浏览器根本不允许你这样做,我已经放弃了这一点。

隐藏的第四种选择是使用HTML5文件系统特性,但由于对技术的支持如此之差,我建议您甚至不要尝试它--您所面临的错误完全是在您的开发机器上,因此,更改您所使用的技术纯粹是为了一个小小的开发方便,这似乎很愚蠢。

Severin提供了指向优秀的XAMPP和MAMP软件包的链接,这是为自己提供一个良好的本地主机服务器的最简单方法。

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

https://stackoverflow.com/questions/19841446

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档