My aim is to reload a page at a certain interval and run a function.
I have read about storing the function in my localStorage and calling it when the page reloads via body onload. I wish to run this code on my console on a page so I don't think the <body> works. Correct me if I am wrong.
A good example would be, continued reloading of a Ebay page and it gets the prices of all toys, then it reloads and gets the price again and it continues to reload till I close the browser. But every time I reload I can't run my function.
All help is appreciated, for my understanding.
Small example:
var
ready = function() {
setTimeout(function() {
//alert('Yay!');
location.reload();
}, 3000); // 3000 ms => 3 seconds
};
<body onload="ready()">
<h1>Page!</h1>
</body>
You can do this with the setinterval function.
It will repeat something afer a certain amount of time.
For the reload, its not really needed as you can call a ajax request and just change the parts that is needed.
example :
setInterval(function () { alert("Hello"); }, 3000);
It will alert out Hello every 3 secounds
If I understand you correctly, you want to run some script at the third-party website (e.g. Ebay), reload page and do it all again.
You can use some browser extensions. For example, that one.
This extension detect page URL and runs any script you have written for it.So, your script automatically runs by extension, do some work, reloads page and then repeats all.
// script runs automatically by extension:
$( function() {
// do some work:
/* some work */
// and then reloads page:
location.reload();
} );
100% working. :)
<html>
<head>
<meta http-equiv="Refresh" content="10">
<script type="text/javascript">
var whenready = function() {
alert('It Works Man..!!');
};
</script>
</head>
<body onLoad="whenready()">
<h1>Page!</h1>
</body>
</html>
$(window).bind("load", function() {
// code here
});
Related
I m trying to update content in my page without refreshing the whole page just by refreshing the div using javascript.
However it does the job, the output is giving the "blink" at set interval to update content.
How can i avoid to hide the "blink" while updating the content.
Here's the code so far :
index.php
<!doctype html public "-//w3c//dtd html 3.2//en">
<html>
<head>
</head>
<body >
<div id="curve_chart"></div>
<br><br>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready( function(){
$('#curve_chart').load('load.php');
refresh();
});
function refresh()
{
setTimeout( function() {
$('#curve_chart').load('load.php');
refresh();
}, 2000);
}
</script>
</body></html>
the load.php contains the content which comes from db.
Now , how do i update the content fetched in load.php in index.php without giving the blink effect for every 2 sec of set interval.
Thanks in advance for every single soul who took a min in going through this. I respect your time.
Try to use .ajax for the call and see if the blinking goes away. .load sometimes recreates the element rather than update it and that causes the blinking when fetching a large amount of data
Edit:
$.ajax({url: "demo_test.php", success: function(result){
$("#curve_chart").html(result);
}});
I figured it out. Thank you all for your time and taking a look at it.
All i had to do is to shift the data fetching code as well as just the data interpreting code to the load.php which is getting refreshed every set interval time. leave the rest divs or sections behind in index page.
Thanks once again.
I've made a small script to load a page into a div of another page, which gets refreshed every 5 seconds.
The page is loaded as expected, but the interval doesn't seem to work.
I already searched for a solution, but all threads are saying that my code should work like that. So I decided to post the full code here.
JQuery (and AJAX):
<script>
function load(){
$('#chatload').load('/intern/chat/chatlogframe.php/?name=muster',function () {
$(this).unwrap();
});
}
load(); // run it on pageload
setInterval(function(){
load() // this should run every 5 seconds
}, 5000);
</script>
The chatlogframe.php file contains a SQL Select query. The data should be reloaded every time the scipt gets executed.
UPDATE:
I checked the Chrome Console where it says Uncaught TypeError: $(...).unwrap is not a function
I don't think that the function is wrong, but maybe it helps.
UPDATE 2:
Heres the html div:
<div id='chatload'></div>
It works. May be there's some issue with your code in $('#chatload').load('/intern/chat/chatlogframe.php/?name=muster',function () {
$(this).unwrap();
});
.unwrap() could be possible issue but to isolate that you would need to post your sample HTML container.
function load() {
console.log("Do something");
$('#chatload').load('https://jsonplaceholder.typicode.com/posts/1', function() {
$(this).unwrap();
});
}
load(); // run it on pageload
setInterval(function() {
load() // this should run every 5 seconds
}, 5000);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="chatload"></div>
Currently I have a script that refreshes my 'chat' page every 10 seconds, as it retrieves the chat from a database. However at the moment once the page is loaded I have to wait 10 seconds (or the seconds i specify in the current js) for the chat to show.
I am not sure how to go about making the chat load initially on window.onload just once, and then every 10seconds. I've tried quite a few ways but they just lead to the onload constantly executing.
current js
<script>
window.onload = function() {
window.setTimeout('document.chatMsgListForm.submit()', 10000)
}
</script>
I gave this a shot too
<script>
var done;
window.onload = function(){
while(!done) {
document.forms['formChat'].submit()
done=true;
}
}
window.onload = function() {
window.setTimeout('document.formChat.submit()', 10000)
}
</script>
But no luck unfortunately.
Thank you
You should to look at using AJAX polling or long polling with WebSockets or something else.
Look this answer and this article, for example.
I'm trying to have a price update in near realtime on my Wordpress site using Javascript. The script works fine when run on XAMPP, but as soon as I put it into Wordpress it doesn't load anything and just outputs... blank. A Javascript button pop up works fine so I know Javascript is working, just not my code.
The script I'm using is as follows:
//create the div
<div id="price"></div>
//include jQuery
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
//the function
<script type="text/javascript">
$(document).ready(function() {
refresh();
$('#price').load('realtime/price-realtime.php');
});
function refresh() {
setTimeout( function() {
$('#price').fadeOut('slow').load('realtime/price-realtime.php').fadeIn('slow');
refresh();
}, 1000);
}
</script>
When visiting realtime/price-realtime.php, the price updates every 1000 milliseconds as is should, fading in and out. For the sake of this example, let's just say the entire contents of price-realtime.php is simply:
2.00
Essentially, I'd like to be able to include the price (a PHP output) on a webpage that doesn't need refreshing. If there's another way or better way of doing it I'd be more than happy to change my method. Hope this makes sense.
Thanks for your help..
I'm trying to use jQuery to make a slightly more sophisticated page refresh. With a meta refresh, if a page fails to load once, it won't load again. I am trying to make something that will repeatedly try to load--if it fails to load once, it will try again the next time so that if the last load is successful I will see a fresh version of the page, whether or not there were intervening faults.
My code at present is:
<script language="JavaScript" type="text/javascript" src="/include/jquery.js">
</script>
<script language="JavaScript">
var delay=5*1000;
function load(){
setTimeout(load, delay);
jQuery("#content").load("calendar_internal.cgi?days=40", function(){
jQuery("#preload").hide("slow");
});
delay = 15*60*1000;
}
jQuery("#content").load("calendar_internal.cgi?days=40", load);
</script>
So far as I can tell, this is functioning as a noop. It doesn't refresh.
How can I get this to work at least at a basic level so it refreshes but one bad refresh doesn't mean that I have to reload if I want to see the page at all?
--EDIT--
What I have now is apparently working (after light testing):
<script language="JavaScript">
var placeholder = jQuery('<div></div>');
function load(){
setTimeout(load, 15*60*1000);
placeholder.load("logistic_ajax.cgi", function(){
if (placeholder.html())
jQuery('#content').html(placeholder.html());
})
}
load();
</script>
var $placeHolder = $('<div />');
$placeHolder.load(yourURL,function() {
if ($placeHolder.html()) {
$("#content").html($placeHolder.html());
}
});
or something like that. This way you are not doing all or nothing type of thing. If something messes up with the HTML coming back, you can check in your "if" condition. Not sure the particulars of the response so you would need to hash that out on your own or let me know more detail.
Cheers.