简体   繁体   English

jQuery .load()函数在Chrome上不起作用?

[英]Jquery .load() function isn't working on Chrome?

I tried to used the .load() function of Jquery. 我试图使用Jquery的.load()函数。 It seem to me that its not working on my Chrome but its working on Firefox and Safari... 在我看来,它不能在Chrome上运行,但可以在Firefox和Safari上运行...

I'm not sure what I did wrong? 我不确定自己做错了什么? Please help me.... 请帮我....

Here's my code below: 这是我的代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <script type="text/javascript" src="js/jquery-1.9.1.js"></script>
    <script type="text/javascript" src="js/jquery-ui.js"></script>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <link rel="stylesheet" href="css/goldstyle.css" type="text/css" media="all"/>

</head>
<body>
    <div id="navcontainer">
        <script type="text/javascript">
            $(document).ready(function() {
                $('#navcontainer').load('nav-menu.html');
            });
        </script>
    </div>
</body>

I found out that if you're directly opening the file in the browser, ie file:/// it will not work in Chrome, and you'll see something like: 我发现,如果您直接在浏览器中打开文件,即file:/// ,它将无法在Chrome中运行,并且您会看到类似以下内容的内容:

Failed to load resource: Origin null is not allowed by Access-Control-Allow-Origin 

You need to setup a web-server, like WAMP, and then run it from localhost instead 您需要设置一个Web服务器,例如WAMP,然后从本地主机运行它

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <script type="text/javascript" src="js/jquery-ui.js"></script>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <link rel="stylesheet" href="css/goldstyle.css" type="text/css" media="all"/>
    <script type="text/javascript">
            $(document).ready(function() {
                $('#navcontainer').load('nav-menu.html');
            });
    </script>
</head>
<body>
    <div id="navcontainer">

    </div>
</body>

I updated your code so the load is in the correct place as its bad practice to have it where it was. 我更新了您的代码,以便将负载放置在正确的位置,这是将其放置在原来位置的错误做法。

Your also shouldnt have jQuery normal and min this will cause some issues to! 您也不应该使用jQuery Normal,这至少会引起一些问题!

It works fine here on Chrome,IE and Firefox. 它在Chrome,IE和Firefox上可以正常运行。

Have you tried pushing F12 for developer tools? 您是否尝试过将F12用于开发人员工具?

Then seeing what errors are displayed in the console? 然后查看控制台中显示了哪些错误?

I had an comparable problem and found out, that Chrome (in opposite to IE or FF) often needs an additional Ctrl + F5 to unload the cached content. 我遇到了一个类似的问题,发现Chrome(与IE或FF相反)通常需要附加的Ctrl + F5来卸载缓存的内容。

For me it seemed that my $().ready function doesn't work, but after Ctrl + F5 it does work. 对我来说,我的$().ready函数似乎不起作用,但是在Ctrl + F5之后它起作用了。

I know it is not exactly an answer to the question, but I came here with this described behaviour - and perhaps others do. 我知道这并不能完全解决问题,但是我是来描述这种行为的-也许其他人也可以。

I met the similar problem and I fix that with adding setTimeout() instead of only function() there, it works. 我遇到了类似的问题,并通过添加setTimeout()而不是仅在其中添加function()来解决该问题,它可以正常工作。

<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(setTimeout(function(){ 
$("#list").load("list.htm", function(){$("#list").hide().slideDown(600);})
},300)); 
</script>
<script language="javascript"> 

My former code not working in Chrome browser but Firefox. 我以前的代码无法在Chrome浏览器中运行,但可以在Firefox中运行。

$(document).ready(function(){ 
    $("#list").load("list.htm", function(){$("#list").hide().slideDown(600);})
    }); 

Hope this could help you. 希望这可以对您有所帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM