Jquery load() only working in firefox?

I am trying to get into jquery/ajax and I can't even believe I can't get past this first test. I'm following an example I found at The Jquery API site and I followed it just about to a T.

I created a local folder on the desktop, and added 2 files.

index.html

and

list1.html.


Index.html:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>

<body>

<div id="stage">
</div>

<script>
$( "#stage" ).load( "list1.html" );
</script>

</body>

</html>

list1.html

<div id="list">
<li>Test</li>
<li>Foo</li>
<li>Bar</li>
</div>

I was trying for like 15 minutes to run index.html in chrome and nothing displayed (like the jquery wasn't loading correctly). Out of pure curiosity I opened it with firefox and it displayed as expected.. something like this

  • Test
  • Foo
  • Bar

So is this a browser issue? Why does Chrome and IE not show this loaded list, but firefox does? I can't figure out if it's my code or the environment which is infuriating when trying to learn.

Answers:

Answer

Try launching chrome / chromium with --allow-file-access-from-files flag set

See How do I make the Google Chrome flag "--allow-file-access-from-files" permanent?

Answer

Try

<script>
    $(function(){
       $("#stage").load("list1.html");
    });
</script>

If still not works, check the Network section in the Developer Tools of your browser and see if there are any HTTP or Security errors.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.