I want to load external javascript file but I can't use AJAX requests because of same origin policy, and I have a code:
<script type="text/javascript">
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'test.js';
head.appendChild(script);
</script>
That is ok everywhere (Firefox, Chrome, Opera, IE9, IE6) but not in IE8, IE7. How can I make it work in IE8?
How about the old document.write('<script language="javascript" src="test.js"><\/script>'). Also you do not have to append to head you can use body to.
Try reading up about JsonP :)
I'm not sure why you had problems in IE, but the following worked in Firefox 4, IE6 and IE9 (i.e. the browsers I had available):
<html>
<head>
</head>
<body>
<script type="text/javascript">
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js';
head.appendChild(script);
var interval = window.setInterval(function() {
if (typeof($) !== "undefined") {
$("<p>it worked!</p>").appendTo(document.body);
window.clearInterval(interval);
}
}, 100);
</script>
</body>
</html>
Related
After my site loaded, I want to delay the below javascript for 10 seconds
script:
<script type="text/javascript" id="io258wer15cfg789as69th07er64hziq" src="//mysite.domain.com/script.php?id=io258wer15cfg789as69th07er64hziq" defer></script>
i tried this but not working:
<script
setTimeout(
function(){
type="text/javascript"
id="io258wer15cfg789as69th07er64hziq"
src="//mysite.domain.com/script.php?id=io258wer15cfg789as69th07er64hziq"
defer }
,10000)>
</script>
You need to add it using createElement. So that it will inject after 10s.
document.addEventListener("DOMContentLoaded", function(event) {
setTimeout(addScript, 1000)
});
function addScript() {
script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.onload = function() {
console.log("Added Script");
};
script.src = 'https://foo.com/bar.js';
document.getElementsByTagName('head')[0].appendChild(script);
}
Try this:
document.onload = function() {
window.setTimeout(function () {
var script = document.createElement('script');
script.async = true;
script.id = 'io258wer15cfg789as69th07er64hziq';
script.src = '//mysite.domain.com/script.php?id=io258wer15cfg789as69th07er64hziq';
document.querySelector('head').appendChild(script);
}, 10000);
};
I'm hoping someone can help me with why my script isn't working in IE 11. Everything works in both Chrome and Firefox and partly works in IE. The problem is that IE doesn't seem to like when I call the function '.pauseVideo()'
IE Console:
Object doesn't support this property or method 'pauseVideo'
I don't know if this is just some syntax error, or if I need to do something different to support the script in IE 11.
Page displaying error - http://goforward.harpercollege.edu/dev-foundation/index-3.php
<script type="text/javascript" src="https://www.youtube.com/iframe_api"></script>
<script type="text/javascript">
window.onYouTubeIframeAPIReady = function() {
for (item in players_list) {
players[players_list[item]] = new YT.Player(players_list[item], {});
}
}
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var players = new Array();
var players_list = [
"popup-youtube-player-1",
"popup-youtube-player-2",
"popup-youtube-player-3",
"popup-youtube-player-4",
"popup-youtube-player-5",
"popup-youtube-player-6"
];
function pauseVideo() {
for (item in players_list) {
players[players_list[item]].pauseVideo();
}
}
function swapvid(id) {
pauseVideo();
$('.video-slider').css('display', 'none');
$('#' + id).closest('.video-slider').css('display', 'inline');
}
</script>
I am loading my script files dynamically using this code,
<script type="text/javascript">
var newscript = document.createElement('script');
newscript.type = 'text/javascript';
newscript.src = '../static/js/jquery.js';
document.getElementsByClassName('container')[0].appendChild(newscript);
var newscript = document.createElement('script');
newscript.type = 'text/javascript';
newscript.src = '../static/js/report_app.js';
document.getElementsByClassName('container')[0].appendChild(newscript);
</script>
It throws error as,
Reference error: $ is not defined
in report_app.js.
I thought, jquery.js script must be loaded into the DOM when the next file, report_app.js is being parsed.
But the error shows, jquery.js is not executed. How to ensure one script file is loaded before running the next one?
It is because the script is added asynchronously, you can use the onload callback
function addScript(path, callback) {
var newscript = document.createElement('script');
newscript.type = 'text/javascript';
newscript.src = path;
newscript.onload = callback;
document.body.appendChild(newscript);
}
addScript('http://code.jquery.com/jquery-1.11.2.js', function () {
addScript('../static/js/report_app.js');
})
Demo: Fiddle
I am using google maps to get the coordinates of a location. My code is running exactly how I want it to however when I click save on the form I get the error in the above title.
Can anyone tell me where I am going wrong?
function init(){
//Calls the loadScript and initialize function and loads the Google Maps API
loadScript('//maps.googleapis.com/maps/api/js?APIKEY&callback=initialize');
}
function loadScript(src,callback){
//Adds the google maps script to the head of the HTML
alert('loading');
var script = document.createElement("script");
script.type = "text/javascript";
if(callback)script.onload=callback;
document.getElementsByTagName("head")[0].appendChild(script);
script.src = src;
}
Apparently all I needed was a try catch around the code:
function loadScript(src,callback){
//Adds the google maps script to the head of the HTML
try{
var script = document.createElement("script");
script.type = "text/javascript";
if(callback)script.onload=callback;
document.getElementsByTagName("head")[0].appendChild(script);
script.src = src;
}catch(e){
alert(e);
}
}
i want to embed swf into javascript, i know there is a method to do this, but how do i do it? here is my javascript
<script type="text/javascript">
adroll_adv_id = "JD5ZGBNO4RBYVAMMMPX3J7";
adroll_pix_id = "CEJOJM5N5VAHBKCVMT2DML";
(function () {
var oldonload = window.onload;
window.onload = function(){
__adroll_loaded=true;
var scr = document.createElement("script");
var host = (("https:" == document.location.protocol) ? "https://s.adroll.com" : "http://a.adroll.com");
scr.setAttribute('async', 'true');
scr.type = "text/javascript";
scr.src = host + "/j/roundtrip.js";
((document.getElementsByTagName('head') || [null])[0] ||
document.getElementsByTagName('script')[0].parentNode).appendChild(scr);
if(oldonload){oldonload()}};
}());
</script>
I have a flash banner actually, and i want to call this javascript into that banner
If you want to call javascript function from flash, then you need to call like this from your flash code,
Externalnterface.call("function_name","arg");
You need to import the library flash.external.ExternalInterface;