I have inherited an app that has this code at the top of every page, after the head tag:
script src="sorttable.js"></script>
<title>Positions</title>
<noscript>
<meta http-equiv="refresh" content="30">
</noscript>
<script type="text/javascript">
<!--
var sURL = unescape(window.location.pathname);
function doLoad()
{ setTimeout( "refresh()", 30*1000 ); }
function refresh()
{ window.location.href = sURL; }
//-->
</script>
<script type="text/javascript">
<!--
function refresh()
{ window.location.replace( sURL ); }
//-->
</script>
<script type="text/javascript">
<!--
function refresh()
{ window.location.reload( true ); }
//-->
</script>
This works, and the page refreshes itself every 30 seconds. (As an aside, I don't understand this code - why there's 3 functions with the same name - and why if I remove any of those functions it either doesn't refresh at all, or when it refreshes it get's an 'untrusted connection' error. But that is not my question.)
In some cases I have to run some code when the page loads:
<script type="text/javascript">
window.onload = function() { sorttable.innerSortFunction.apply(document.getElementById("FVShort-4"), []); }
</script>
My problem is that in the cases when I do have that onload function, the pages no longer refreshes. How can I have both the onload function and still have the automatic refresh work?
Related
I can't manage to reload my page with jquery after the click function. the assignment is to use a click function with the a tag in the body tag. the a tag must fade and reload the same page. So the following things are needed:
• Give the page to be loaded as an argument to the onclick function.
• Fading out itself takes 1.5 seconds.
• After fading out, you can load a page stored in the variable url with the following command:
window.location.href = url;
Write the jQuery code to hide the page after loading the web page. Then you ensure that the page arrives in 1.5 seconds.
So I tried these things...
Function's like: $("a").click(function(){
$("p").fadeToggle();
$("p").fadeToggle("slow");
$("p").fadeToggle(1500);
I've also tried to use fadeIn and fadeOut in the code, but it doesn't help..
<html>
<head>
<script src="jquery-3.4.1.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery</title>
<script>$(document).ready(function(){
$('a').click(function(e) {
e.preventDefault();
newLocation = this.href;
$('p').fadeOut('slow', newpage);
});
function newpage() {
window.location.href = url;
}
});
</script>
</head>
<body>
<p>Click here to reload the page</p>
</body>
</html>
You weren't passing your url anywhere.
See this JSFiddle: https://jsfiddle.net/fpnecajo/1/
$('a').click(function(e) {
e.preventDefault();
newLocation = this.href;
$('p').fadeOut('slow', newpage(newLocation));
});
function newpage(url) {
window.location.href = url;
}
You can refer the snippet below
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>$(document).ready(function () {
$('a').click(function (e) {
e.preventDefault();
newLocation = this.href;
$('p').fadeOut('slow', newpage);
});
function newpage() {
window.location.href = "http://www.google.com";
}
});
</script>
<p>Click here to reload the page</p>
I am creating a web app using asp.net mvc. I want to detect a manual refresh by a user,
but I am not able to get the following events
1: beforeunload
2: unload
the following way I Tried
1
$(window).on('beforeunload', function () {
pageCleanup();
});
2
$(window).on("unload", function () {
pageCleanup();
});
function pageCleanup() {
alert(1)
}
3
window.addEventListener("unload", logData);
function logData() {
alert(1)
}
4
$(window).unload(function () {
alert('1');
});
the above is an example with alert, I want to have an ajax call in
unload function
but none of these seems to execute when a user press any kind of refresh(F5, ctrl-shift-R, ctrl-R, from url tab)
what should I try now?
Hi Check Once and Let me know
<html>
<head>
<title>Refresh a page in jQuery</title>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
</head>
<body>
<h1>Stop a page from exit with jQuery</h1>
<button id="reload">Refresh a Page in jQuery</button>
<script type="text/javascript">
$('#reload').click(function() {
location.reload();
});
$(window).bind('beforeunload', function(){
return '>>>>>Before You Go<<<<<<<< \n bro!!Working';
});
</script>
</body>
</html>
You should use bind for beforeunload:
$(window).bind("beforeunload", () => alert(1));
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
I can't seem to get my javascript to work on my page, the same code works on another page, but not the one i'm using currently. the code is:
<script type="text/javascript">
function codeAddress() {
var $scores = $("#usersload");
setInterval(function () {
$scores.load("users.php #usersload");
}, 15000);
}
window.onload = codeAddress;
</script>
The above code should refresh a div on the page every 15 seconds, when the page loads, but does nothing, but on my other page it does what its suppose to.
if you need more code from my page let me know, but if you can help, thanks in advance!
Javascript on page:
<script>var init = [];</script>
<!-- Get jQuery from Google CDN -->
<!--[if !IE]> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- <![endif]-->
<!--[if lte IE 9]>
<script type="text/javascript"> window.jQuery || document.write('<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">'+"<"+"/script>"); </script>
<![endif]-->
<!-- Pixel Admin's javascripts -->
<script type="text/javascript" src="assets/javascripts/bootstrap.min.js?parameter=1"></script>
<script type="text/javascript" src="assets/javascripts/pixel-admin.min.js?parameter=1"></script>
<script type="text/javascript">
init.push(function () {
// Javascript code here
});
window.PixelAdmin.start(init);
</script>
<script type="text/javascript">
function codeAddress() {
var $scores = $("#usersload");
setInterval(function () {
$scores.load("users.php #usersload");
}, 15000);
}
window.onload = codeAddress;
</script>
Could it be possible.
Have you added jQuery to the page yet, before this script block ofcourse.
The simplest way to do so..
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
Tried this on y page and this works
<script type="text/javascript">
function call(){
var $scores = $("#usersload");
$.post('user.php',{blankpost:''}, function(result){
$scores.html(result);
});
}
function codeAddress() {
setInterval( function(){
call();
}, 1000);
}
window.onload = codeAddress();
</script>
the blank post is ust to post something on the page, and just display the result
On the last line of your code, you have:
window.onload = codeAddress;
With that being said, shouldn't you still have to pass it an empty parameter such as the following?
window.onload = codeAddress();
I have a simple program that is refreshing an page every 100 milliseconds. But when i am trying to run it i am simply getting an blank page.Here is my html
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#load_tweets').load('demo.php').fadeIn("slow");
}, 10000); // refresh every 10000 milliseconds
<body>
<div id="load_tweets"> </div>
</body>
</script>
Please help me to solve this problem as i am beginner to jquery.Thanks in advance
the problem is closing script tag
try like this
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#load_tweets').load('record_count.php').fadeIn("slow");
}, 10000); // refresh every 10000 milliseconds
</script>
</head>
<body>
<div id="load_tweets"></div>
</body>
</html>
Use setTimeOut() instead.
setTimeout("yourfunction()", 1000); // call yourfunction() after 1 second
function yourfunction(){
//do what you want
}
Also correct your HTML!
Can I use body onload and window.onload at the same time? I've tried it using this code
<body onload = "alertFirst()">
</body>
<script>
window.onload = alertSec;
</script>
But it didn't work. I just need someone to confirm it to me. Many thanks
The answer to your question is "no". However there are ways around it.
Adding both calls to one onload function is ideal, but if you /have/ to add an onload handler after one is already added, and you are not using a framework which facilitates this, you can get by like this:
<html>
<head>
<script type="text/javascript">
function alertFirst(){
alert('First');
}
function alertSec(){
alert('Second');
}
</script>
</head>
<body onload="alertFirst();">
content
</body>
<script>
var func = document.body.onload;
window.onload=function(){
func();
alertSec();
}
</script>
</html>
You can (by adding event handler(s)) but you should NOT have both
Instead add the call to the window.onload:
<html>
<head>
<script>
window.onload = function() {
alertFirst();
alertSec();
}
</script>
</head>
<body>
</body>
No, document.body.onload is actually mapped to window.onload. You can check yourself—when you have <body onload="a()"> and to console.log(window.onload), a() is printed out into the console.
What you can do is to have one onload event handler that calls two other functions.
window.onload = function () {
a();
b();
};
or two event listeners
window.addEventListener('load', a, false);
window.addEventListener('load', b, false);
If one or more of the scripts you want to use has the event handler in the BODY HTML tag, you can still move it to into javascript code. See the example below:
Script #1:
<script language="javascript">
function start(){
...code for script #1...
}
</script>
<body onload="start()">
Script #2:
<script language="javascript">
function init(){
...code for script #2...
}
window.onload=init;
</script>
Result:
<script language="javascript">
function start(){
...code for script #1...
}
function init(){
...code for script #2...
}
window.onload=function(){
start();
init();
}
</script>
<body>
I think it may can help you.