My code is:-
<html>
<head>
<script>
function welcome()
{
alert("Successfully loaded");
}
function bye()
{
alert("Unload");
}
</script>
</head>
<body onload="welcome()" onunload="bye()">
</body>
when i execute this only the function for "onload()" is called. Can you tell me how to trigger "onunload()" event also...
It really depends on what browser you test it
The onunload event is supported in IE, Firefox, and Safari, but not supported properly in Chrome or Opera.
please try onbeforeunload
<body onload="welcome()" onbeforeunload="bye()">
</body>
https://developer.mozilla.org/en-US/docs/DOM/window.onbeforeunload
Related
I tried my code on chrome, opera, firefox and edge but it's not working. My onload code works perfectly, but onunload doesn't work on all. Do not know why?
Here is my code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body onload="loaded()" onunload="unloaded()">
<script type="text/javascript">
function loaded(){
alert("The page loaded!");
}
function unloaded(){
alert("Come again!");
}
</script>
</body>
</html>
Some operations are not allowed on onunload event showing alert is one of them. Check this answer.
You can use below code to display a warning message to users.
window.onbeforeunload = function(e) {
return 'Bye now!';
};
when you invoke the unload function,the DOM is completely unload now.
So there can't show an alert window for you.
But you can see the log printed in the console if you use
---> console.info("Come again!");
I ran the below code and tried it on all browsers but it didn't work
//HTML Code
<html>
<head><title>Test</title></head>
<body onload="LaunchImageSlider();">
<script type="text/javascript" src="Scripts/javascript code.js"></script>
</body>
</html>
//javascript code.js
function LaunchImageSlider() {
window.addEventListener("load",function() {alert("Hi")});
}
I did not get any alert message. My actual aim is to create an image slider once the page is loaded so I began first by seeing whether the "addEventListener" works.
What am I doing wrong here?
I referred to the below questions already, but nothing helped:
addEventListener is not working
addEventListener() not working
addEventListener not working
addEventListener in javascript
A possible solution:
<html>
<head>
<title>Test</title></head>
<body>
<script type="text/javascript" src="Scripts/javascript code.js"></script>
<script type="text/javascript">
(function () {
LaunchImageSlider();
})();
</script>
</body>
</html>
But in the function you should not add and eventListener, as it is run after the window has loaded. You should just run the callback method directly. So using your example:
//javascript code.js
function LaunchImageSlider() {
alert("Hi");
}
Within Internet Explorer 9 & 10, the localStorage implementation fires events unexpectedly (great thread here: Bug with Chrome's localStorage implementation?)
Does anybody know of a way to stop the storage event from firing on tabs that initiated the change within internet explorer?
For example the following shouldn't show an alert when the add button is clicked, but it does in IE:
fiddle: http://jsfiddle.net/MKFLs/
<!DOCTYPE html>
<html>
<head>
<title>Chrome localStorage Test</title>
<script type="text/javascript" >
var handle_storage = function () {
alert('storage event');
};
window.addEventListener("storage", handle_storage, false);
</script>
</head>
<body>
<button id="add" onclick="localStorage.setItem('a','test')">Add</button>
<button id="clear" onclick="localStorage.clear()">Clear</button>
</body>
</html>
EDIT:
On a side note, I've opened a bug with MS here. https://connect.microsoft.com/IE/feedback/details/798684/ie-localstorage-event-misfired
Maybe it won't get closed.....
Changing your script to the following prevents the handling of any storage events in the focused window.
This isn't precisely what you asked, as I believe that would require a patch to the browser, but it causes IE 9/10 to conform to the spec while having no adverse effects on other browsers (other than the global and listeners).
<script type="text/javascript" >
var focused;
window.addEventListener('focus', function(){focused=1;}, false);
window.addEventListener('blur', function(){focused=0;}, false);
var handle_storage = function (e) {
if(!focused)
alert("Storage",focused);
};
window.addEventListener("storage", handle_storage, false);
</script>
See this fiddle for the updated, conforming behavior.
Edit: The following also works and avoids the listeners at the cost of a runtime check of window focus:
<script type="text/javascript" >
var handle_storage = function (e) {
if(!document.hasFocus())
alert("Storage");
};
window.addEventListener("storage", handle_storage, false);
</script>
Any ideas why this code doesn't work?
<html><head>
<script type="text/javascript">
document.onDOMContentLoaded=function(){
alert('aaaaaaaaaaaaaa');
}
</script>
</head>
<body>
<div id="mydiv"></div>
</body>
</html>
onDOMContentLoaded is expected to triogger when the webpage is loaded and make that alert but it doesn't work dunno why
You should be binding to the event with addEventListener:
document.addEventListener("DOMContentLoaded", function() {
alert('aaaaaaaaaaaaaa');
});
http://jsfiddle.net/qHa4T/1
Keep in mind that both addEventListener and DOMContentLoaded won't work with IE8 and below.
It seems that Firefox treats any error that occurs in the window.onerror event handler as a fatal exception even if the exception is caught. The following code sample works as expected in IE, Chrome, and Safari. In Firefox, the call to the non-existent abc() method halts the execution immediately instead of executing the catch block and the remainder of the onerror handler.
Is this expected behavior in Firefox or am I doing something wrong?
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.7.js"></script>
<script type="text/javascript">
$(document).ready(function() {
window.onerror = function() {
console.log('begin onerror');
try {
abc(); // create a runtime error by calling a method that doesn't exist
} catch(e) {
console.log('catch block');
}
console.log('end onerror');
};
$('#btn').click(function() {
xyz(); // create a runtime error by calling a method that doesn't exist
});
});
</script>
</head>
<body>
<form action="" name="frmEdit">
<input type="button" value="Test" id="btn" name="btn" />
</form>
</body>
</html>
As this testcase demonstrates, it's related to jQuery.
Replacing the jQuery dependency with the minimal code necessary to trigger this behavior will either explain this or make this easier to debug and fix on the Firefox side.
[edit] Thanks to jrotello, dmethvin, and Firefox developers, the underlying issue should be fixed in Firefox 14 (you can test it before it's released using http://nightly.mozilla.org/)