I was using an advertising service (banner) which had a simple refresh timer in it. Where I could specify after what time the advert should be reloaded (or a new one should be served)
I've switched my banner provider and the new one does not have that built in option.
I've tried refreshing the div normally but that doesn't work since the content seems to remain the same.
Any ideas on a javascript code which can refresh a banner ad?
<script langauge="javascript">
window.setInterval("refreshDiv()", 60000);
function refreshDiv(){
document.getElementById("advert_div").innerHTML;
}
</script>
and here is the advertisers div
<div id="advert_div">
<script type="text/javascript">
//<![CDATA[
LSM_Slot({
adkey: '645451',
ad_size: '300x250',
slot: 'slot656464'
});
//]]>
</script>
</div>
I say my idea or suggest.
I had one situation but there was the script with document.write() and this is not that you used.
Info: my answer (I was writing before the update's question)
2. idea
In your case
<script language="javascript">
window.setInterval("refreshDiv()", 60000);
function refreshDiv(){
document.getElementById("advert_div").innerHTML;
}
</script>
The document.getElementById("advert_div").innerHTML miss = as what?
Example
document.getElementById("advert_div").innerHTML="<p>Welcome</p>"
EDIT:
You can create the element with
document.getElementById("advert_div").innerHTML="";
var src1 = 'script',
script1 = document.createElement('SCRIPT');
script1.type="text/javascript";
script1.src = src1;
document.getElementById("advert_div").appendChild(script1);
This is a banal example but you can create the function in every banner and create the function:
"use strict";
var name = "foo";
var func = new Function(
"return function " + name + "(){ alert('sweet!')}"
)();
//call it, to test it
func();
Info:
function refreshDiv(){
document.getElementById("advert_div").innerHTML="";
//Calling the function using the if
}
Now I do not know exactly what you want to do and I writing my ideas.
Good luck and if you seek help.
Related
This is really strange and I've never encountered it before. I have a javascript script tag that I'm using on one of my xenforo pages, but it's not showing up so I commented it out for testing. Here's what's weird:
When I comment the code, view page source shows the code as commented, but when I go to uncomment it again then page source shows no trace of it and it's just removed.
Has anyone ever experienced this? This is the only javascript tag I can see that's doing this, but I can add anything else in its place and it shows properly, but given the fact that it shows when commented I just can't seem to figure out what's going on.
Does this sound familiar to anyone?
UPDATE: adding code
<head>
<script type="text/javascript">
console.log('test function')
</script>
<script type="text/javascript">
(function(){
console.log('in function now');
var site_id = 0000;
var data_site_id = 0;
var sn_cb = new Date().getMonth();
var snack_hb = document.createElement('script');
snack_hb.src = 'https://cdn-header-bidding.snack-media.com/assets/js/snack-loader/'+site_id+'?cb='+sn_cb;
snack_hb.id = 'snack_ads';
if(data_site_id){
snack_hb.setAttribute('data-site-id',data_site_id);
}
console.log(snack_hb);
document.body.appendChild(snack_hb);
snack_hb.onerror = function(){
document.body.removeChild(snack_hb);
var snack_hb2 = document.createElement('script');
snack_hb2.src = 'https://cdn2-header-bidding.snack-media.com/assets/js/snack-loader/'+site_id+'?cb='+sn_cb;
snack_hb2.id = 'snack_ads';
if(data_site_id){
snack_hb2.setAttribute('data-site-id',data_site_id);
}
document.body.appendChild(snack_hb2);
};
})();
</script>
</head>
If I run this, then I see the 'test function' print in console, but the script below it literally doesn't exist on the page
How can I reload a single JS file on a window resize? I only need to reload a single JS file every time I resize the window so it wil reset the JS file. I have found here a script long time ago, but I can not find him.
<script src="js/scripts.js" type="text/javascript"></script>
Thnx gr Pascal
I don't see jQuery tagged, so the other responses likely won't work for you.
You basically need to capture the window resize event, which occurs for (practically) every pixel the browser is resized. This means you'll need to use setTimeout to wait for a finished resize (otherwise, you'll be reloading a script 1000x for every resize). Then you can set the source of the script to the same file, appending a timestamp that will force a non-cached refresh.
Here's how I would implement this: (http://jsfiddle.net/gbez11h2/)
HTML:
<script id="scriptToReload" type="text/javascript" src="path/to/script.js">
Javascript:
;(function (w, d) {
"use strict";
var timeout = null,
scriptEl = d.getElementById('scriptToReload'),
scriptSrc = scriptEl.src,
delay = 500; // How long to wait (in ms) before deciding resize is complete
w.onresize = function () {
// Clear previous timeout to indicate resizing is still occurring
w.clearTimeout(timeout);
timeout = w.setTimeout(function () {
// Resizing is (probably) done, now we can reload the script
// Start by destroying previous script element
scriptEl.parentElement.removeChild(scriptEl);
// Now we recreate the same element, with a timestamp cache-buster
scriptEl = d.createElement('script');
scriptEl.type = 'text/javascript';
scriptEl.src = scriptSrc + '?_=' + (new Date().getTime());
// And insert it into the DOM to be (re-)loaded
d.getElementsByTagName('head')[0].appendChild(scriptEl);
}, delay);
};
})(window, document);
Note that the Javascript will need to either go after the original <script> definition, or placed into a window.onload function.
you could try to append new script tag like that:
$(function(){
$('button').click(function(){
var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = 'https://**.js';
$("head").append( script );
});
})
Like this:
function bind()
{
$(window).resize(function () { $("#scriptToReload").attr("src", "reloadedScript.js"); });
}
$(document).ready( function () { bind();} );
<script type="text/javascript">
//window.onload = Now;
function Now(){
var n=new Date();
return n.toLocaleDateString();
};
</script>
i put the above code in the head part.
<body onload="Now();">
but on the page, there is no show anything.when i using window.onload = Now or put the script code after the label; the result is the same, why?
ps:i want to write the result out on the page. but when i used document.write(Now()); it still not displayed on the page.
You aren't doing anything with the return value of Now(), so it is being quietly discarded.
Perhaps you want to do something like onload="alert(Now());"
Try to put alert box. If it exists in the script or not.
Modify your HTML a bit to have a DOM element that will help you post the resut onto your page,
<body onload="Now();">
<span id="dateHelper"></span>
</body>
And then modify your script to do the following,
function Now(){
var n=new Date();
var lds = n.toLocaleDateString();
document.getElementById("dateHelper").innerHTML = lds;
};
Test Link
I have a PHP page that loads external content using other PHP files. I'm using include so it should be pretty simple. I had a scrollTo function (below) that I removed. However, ever since I did that when I reload the main page I can see in the URL that it is scrolling to every hash mark really quick, ending in the last section.
I really don't know what script may be causing that. I used Chrome Elements but I don't see anything.
I've been trying to figure this out for the past two hours so I really need another set of eyes to help me figure out where is this coming from. So please just take a quick look.
Here is the live test page that's going crazy now.
Test page
Here is the JS code I had originally, and then removed
$().ready(function(){
var currentAnchor1 = null;
//Check if it has changes
if(currentAnchor1 != document.location.hash){
currentAnchor1 = document.location.hash;
//if there is not anchor, the loads the default section
if(!currentAnchor1){
query1 = "page=1";
}
else
{
//Creates the string callback. This converts the url URL/#main&id=2 in URL/?section=main&id=2
var splits1 = currentAnchor1.substring(1).split('&');
//Get the section
var page1 = splits1[0];
delete splits1[0];
var query1 = "page=" + page1;
}
//Send the petition
$.scrollTo( document.location.hash, 500, { easing:'elasout' });
}
});
This is coming from your PHP page. 4100.php is outputting inline JavaScript.
You can't use <!-- for block comments in JavaScript so your window.location calls are indeed still happening. (For multiline comments in JavaScript, surround the lines with /* and */ instead.)
Line 2485:
<script type="text/javascript">
<!--
window.location = "http://www.period3designs.com/tmss/l1/terminals/4100.php#4100errors"
//-->
</script>
Line 4779:
<script type="text/javascript">
<!--
window.location = "http://www.period3designs.com/tmss/l1/terminals/4100.php#4100guides"
//-->
Line 5319:
<script type="text/javascript">
<!--
window.location = "http://www.period3designs.com/tmss/l1/terminals/4100.php#4100howto"
//-->
</script>
Line 5393:
<script type="text/javascript">
<!--
window.location = "http://www.period3designs.com/tmss/l1/terminals/4100.php#4100functions"
//-->
</script>
Line 5467:
<script type="text/javascript">
<!--
window.location = "http://www.period3designs.com/tmss/l1/terminals/4100.php#4100menus"
//-->
</script>
I am using Google Custom Search Engine with their new auto-completion feature. I want this whole javascript to be loaded AFTER the page itself is loaded. The original Google code is this:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('search', '1');
google.setOnLoadCallback(function() {
google.search.CustomSearchControl.attachAutoCompletion(
'some-long-unique-id',
document.getElementById('q'),
'cse-search-box');
});
</script>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=cs"></script>
I have transformed this code using tutorial about JS dynamic loading to this code:
(function() {
var goog = document.createElement('script'); goog.type = 'text/javascript';
goog.src = 'http://www.google.com/jsapi';
var cse = document.createElement('script'); cse.type = 'text/javascript';
cse.src = 'http://www.google.com/cse/brand?form=cse-search-box&lang=cs';
goog.onload = function() {
google.load('search', '1');
google.setOnLoadCallback(function() {
google.search.CustomSearchControl.attachAutoCompletion(
'some-long-unique-id',
document.getElementById('q'),
'cse-search-box');
});
};
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(cse, s);
s.parentNode.insertBefore(goog, s);
})();
Well, even though I think my solution should work(the same way has Google changed their Analytics on-demand asynchronous code), it doesn't. The page loads fine and as soon as CSE loads, the page goes blank. Something clears the DOM, I suppose its some kind of "Google thing" ? Can someone bring some light on this problem and possibly a working solution ?
Thanks
OK, so by checking Google Loader Developer's Guide and by lots of trying-and-testing I've figured how to change my code so it works as I expected in my question:
(function() {
var goog = document.createElement('script'); goog.type = 'text/javascript';
goog.src = 'http://www.google.com/jsapi';
goog.onload = function() {
google.load('search', '1', {"callback": function() {}});
google.setOnLoadCallback(function() {
google.search.CustomSearchControl.attachAutoCompletion(
'some-long-unique-id',
document.getElementById('q'),
'cse-search-box');
});
};
var cse = document.createElement('script'); cse.type = 'text/javascript';
cse.src = 'http://www.google.com/cse/brand?form=cse-search-box&lang=cs';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(cse, s);
s.parentNode.insertBefore(goog, s);
})()
The main thing is this line:
google.load('search', '1', {"callback": function() {}});
If you don't specify callback (at least empty function as I do), then the whole page goes blank, when Google's CSE loads. I have no idea why, but it works fine now with this dummy callback function.
Hope it helps someone with the same problem.
I guess you can use some js loader (eg yepnope) that allows you to load js on demand and add a callback.
I don't fully-understand what you're trying to achieve. You've asked for someone to suggest how to 'correct' your code, but you haven't given any context, or what you actually want the end-result to be.
Also, the updates you've provided with the function()s you've written- it's not clear how these are being called. In the when the document readyState is complete?
Firstly, I'd suggest using jQuery to wrap up the JavaScript stuff. Yes, Google provide onload events and other helpers for their API, but jQuery will apply to any Javscript, there's no point in using two Javascript frameworks where you don't have to.
The jQuery might be like this:
<script type="text/javascript" language="javascript" src="/js/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" language="javascript">
// Use the jQuery document load functionality.
$(document).ready(function ()
{
// Load the Google API asynchronously. The callback 'GoogleApiLoaded' will be called when the script is fully-loaded.
$.getScript("http://www.google.com/jsapi?key=yourkey", GoogleApiLoaded);
// Load other scripts, do other init code here (non-Google-dependent).
});
function GoogleApiLoaded()
{
// Google-related init here.
// Load the custom search API.
// (Could make the callback an in-line function).
$.getScript("http://www.google.com/cse/brand?form=cse-search-box&lang=cs", CustomSearchApiLoaded);
}
function CustomSearchApiLoaded()
{
google.load('search', '1', LoadCustomSearchControl);
}
function LoadCustomSearchControl()
{
google.search.CustomSearchControl.attachAutoCompletion('some-long-unique-id', document.getElementById('q'), 'cse-search-box');
}
</script>
It might be helpful to break the code apart into different functions, in order to track-down more easily where the problem is. That you have to put in an optional callback on the 'google.load()' function is strange- it may be a bug in the Google code, there are some floating around.
I've used google.load('search', '1', LoadCustomSearchControl), rather than the google.setOnLoadCallback, because as far as I can see they should do the same thing, and using a callback on load() is neater, in my view.
I'd strongly advise you use jQuery (or any JavaScript framework), as it makes life a lot easier.
I'd be interested to see whether what I've suggested works, and if not where it goes wrong. (Make sure to add-in your own JSAPI key).