# Other Programming > AJAX >  Chrome - jquery headache

## codecat

Hi all,
 I am new to programming and have a predicament, my document.ready function is working in firefox and safari, but not in chrome, I have tried changing the function to window.load function and still nothing .
please help 

thanks

----------


## the_cat

You mention jQuery in the title - why not put your code inside the jQuery document ready function?


```
$(function(){
// your code goes here
});
```

----------


## codecat

> You mention jQuery in the title - why not put your code inside the jQuery document ready function?
> 
> 
> ```
> $(function(){
> // your code goes here
> });
> ```


I have the code within the jquery document.ready function, the problem is it will not categorically work in chrome, its not syntax, its not window.load its not the version of jquery or chrome itself (all up to date). The only other possible issue it could be is allow access all files and trying to repair or fix that on a mac is impossible so all in all a headache

----------


## the_cat

I have tested it with the latest version of Chrome on Windows 7 and it seems to be working fine. Maybe the problem lies elsewhere?
Here's the full listing of my test file and it duly pops up an alert on IE11, FF26, and Chrome (31.0.1650.63 m):


```
<!DOCTYPE html>
<html>
<head>
<title>Test document.ready</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
$(function(){
	alert('document ready');
});
</script>
</head>
<body>
Testing document.ready function
</body>
</html>
```

----------


## codecat

Yes the alert fucntion document.ready works great however, I am trying to display an external html file within an html file using document.ready, the reason for this is, I am developing a website with a nav bar as expected however, I want the said nav bar to stay at the top of the page and the pages to change as clicked underneath

----------


## codecat

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#test").load ("#header.html");

  });
});
</script>
</head>

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


heres the source code

----------


## the_cat

You shouldn't have the hash in front of "header.html". 
The other thing to note (see the documentation: http://api.jquery.com/load/ ) is the same origin policy: "Due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, or protocol"

----------


## codecat

ive tried it without the # and no luck as to the same origin policy how do I fix it?

----------


## the_cat

Run it from a web server. It appears to be a Chrome bug to do with CORS (cross origin sharing) : http://code.google.com/p/chromium/is...etail?id=67743
If you're running it from localhost then the AJAX call won't work in Chrome.
If you open the developers console in Chrome (F12 on Windows) then you get the error "XMLHttpRequest cannot load" (header.html) "No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access."

----------


## codecat

ok so running it on  a web server is the answer? if I 'publish' the website and launch in chrome should that do it? that XMLHttPRequest message is exactly what I get on the mac

----------


## the_cat

Try it - it should work! Assuming that the webserver supports the Access-Control-Allow-Origin header which it probably does (or can be made to).

----------


## codecat

right but how do I repair the access control allow origins bug because having to publish before testing seems a bit of a stretch just for checking? also is their a javascript function that I can use to do the same thing? im sure there has to be a quicker easier way of having the same menu appear on multiple pages? can I also just say thank you ever so much for all your help its been really great  :Smilie:

----------


## the_cat

I can't help with the first part of your query I'm afraid. If you Google the problem there is mention of starting Chrome from the command line with security disabled: http://babbeg.com/2012/02/06/disable...n-with-chrome/  - maybe that will help?
In terms of having the same content on multiple pages, it will depend on your web server. If it supports ASP then you can #INCLUDE the same file on multiple pages: http://www.w3schools.com/asp/asp_incfiles.asp
PHP supports this too: http://www.w3schools.com/PHP/php_includes.asp (in fact this example is exactly for having the same menu on multiple pages).

----------


## codecat

IVE PUBLISHED AND IT WORKS ON CHROME!!!!! 


Thanks ever so much you are a life saver!!!!  :Smilie:   :Smilie:

----------


## the_cat

You're welcome - glad it worked!

----------


## patel_rosh

may be you could try out Google Chrome Support for perfect solution to your  Answer!!

----------


## Tahir Marfani

check this function and apply it.

$(function(){
// your code goes here
});

----------

