admin管理员组

文章数量:1332649

After over an hour of trying to get it to work I'm thinking it's because of cross domain policies, but I really thought this would work. I can't find a lot of info on it either. But, here is my issue. I have a site called and then I include a 3rd party script (what im writing) and its at .js and this script needs to dynamically load the google maps api at: before it runs. Well, i figured this code would work:

function loadScript(filename,callback){
  var fileref=document.createElement('script');
  fileref.setAttribute("type","text/javascript");
  fileref.setAttribute("src", filename);
  fileref.onload = callback();
  if (typeof fileref!="undefined"){
    document.getElementsByTagName("head")[0].appendChild(fileref)
  }
}

loadScript('',function(){
  console.log('done loading');
  init();
});

But my response in my console is:

api.js:408 done loading
api.js:115 test
api.js:310 Uncaught ReferenceError: google is not defined

the "test" is at the top of the init(). So, it's loading the script, but it's not executing it, it seems. So, any ideas? If it is a cross site scripting issue my only method of fixing this i could think of is having a PHP script on our end that basically just sets the header to a text/javascript header and then echo file_get_contents() into a googlemaps.php file we host. About to try this as we speak, but, if possible, a way to do it with pure JS would be awesome.

P.S. I also tried adding jQuery, then doing getScript(), and it still didnt work

-- UPDATE --

See this fiddle: /

You'll see that you get the error in your console: Uncaught TypeError: undefined is not a function

Despite that the google variable is global.

After over an hour of trying to get it to work I'm thinking it's because of cross domain policies, but I really thought this would work. I can't find a lot of info on it either. But, here is my issue. I have a site called http://mysite. and then I include a 3rd party script (what im writing) and its at http://supercoolsite./api/script.js and this script needs to dynamically load the google maps api at: http://maps.google./maps/api/js?sensor=false before it runs. Well, i figured this code would work:

function loadScript(filename,callback){
  var fileref=document.createElement('script');
  fileref.setAttribute("type","text/javascript");
  fileref.setAttribute("src", filename);
  fileref.onload = callback();
  if (typeof fileref!="undefined"){
    document.getElementsByTagName("head")[0].appendChild(fileref)
  }
}

loadScript('http://maps.google./maps/api/js?sensor=false',function(){
  console.log('done loading');
  init();
});

But my response in my console is:

api.js:408 done loading
api.js:115 test
api.js:310 Uncaught ReferenceError: google is not defined

the "test" is at the top of the init(). So, it's loading the script, but it's not executing it, it seems. So, any ideas? If it is a cross site scripting issue my only method of fixing this i could think of is having a PHP script on our end that basically just sets the header to a text/javascript header and then echo file_get_contents() into a googlemaps.php file we host. About to try this as we speak, but, if possible, a way to do it with pure JS would be awesome.

P.S. I also tried adding jQuery, then doing getScript(), and it still didnt work

-- UPDATE --

See this fiddle: http://jsfiddle/ycMCa/2/

You'll see that you get the error in your console: Uncaught TypeError: undefined is not a function

Despite that the google variable is global.

Share Improve this question edited Apr 29, 2011 at 10:06 Oscar Godson asked Apr 29, 2011 at 9:37 Oscar GodsonOscar Godson 32.8k42 gold badges125 silver badges206 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 8

You just have a minor error:

fileref.onload = callback();

This will call callback immediately and assign its return value to fileref.onload.

It should be

fileref.onload = callback;

You also should add the handler before you set the source (just in case).

DEMO

本文标签: securityDynamically load JavaScript with JavaScriptStack Overflow