window.unload not working in jquery - javascript

Here I have an anchor tag in my html page which will go to Google when I click. I have a jQuery function which needs to be fired when the page leaves.
$(window).unload(function(){
alert('fffffffff');
});
I found this works fine in a video tutorial. But it's not working for me. Using firefox. help

Its working fine, you just need to remove the alert, as some browsers don't allow alert on unload event.
$(window).unload(function(){
console.log("hello");
});
try this http://jsfiddle.net/vyMdF/
Just run it again and you can check the console.
You can refer over here $(window).unload is not firing

window.onbeforeunload = function() {
return "Are you sure you wish to leave the page?";
}

Related

Event to be triggered when leaving website or closes the browser

I´m trying for a while execute a JavaScript function when a user leaves web site by typing a address in the browser and hits return or the user closes the browser clicking in the x button.
I tried the unload event but I cannot get the alert.
This is what I am doing:
$(window).unload(function () {
alert("Are you sure?");
});
also
$(body).unload(function () {
alert("Are you sure?");
});
I am running out of ideas!
You can listen to beforeunload event that fires before the unload event, when the page is unloaded.
$(window).on('beforeunload', function(){
// ...
})
Some browsers (like Chrome) block alerts in unload event handlers, to prevent exactly these kind of annoying messages. Try a console.log or put a breakpoint in to find out if the handler is triggered when you don't have an alert there.
SO question on a similar line:
window.onunload is not working properly in Chrome browser. Can any one help me?
You can only pass the alert by returning a string in a beforeunload handler (HT #undefined), but I would avoid even that, because popups are generally bad, and most people will do minimum processing to work out the make-this-thing-go-away option before they actually think about the contents of the box.
The function you defined in window.onbeforeunload if it returns a string it will pop up a confirm navigation prompt with that message.
Alerts may be ignored!
window.onbeforeunload = function() {
return "All unsaved data will be lost. Are you sure?";
};
Some browsers handle the onbeforeunload differently. Recent Firefox for example will ignore your return string and just display a standard message.
$(window).bind('beforeunload', function(){
alert("Are your sure?")
});

Is jQuery 1.3.2 causing this not to work, or something else?

I know that this is supposed to work, it works fine in 1.7.2
//click anywhere to close dropdown
$("html").live("click", function () {
closeDropdown();
});
//on click of ellipsis, open dropdown
$("span.PivotEllipsis").click(function (e) {
e.stopPropagation();
openDropdown();
});
It is the classic click outside span.PivotEllipsis to hide. However, the problem is that the second function is not working. The first is working fine, when you click outside, it hides. However, when you click on the span.Pivot Ellipsis it doesn't pop up, instead I think, hard to tell though, that it runs openDropdown() and then immediately after closeDropdown()....
Anyone know what it wrong?
According to jQuery Documentation: "it is not possible to stop propagation of live events." You don't really need to use .live() as the html element exists at document.ready and isn't dynamically loaded
What you thought is probably correct - you need to disable the first function while the dropdown menu is not open.

Showing a jQuery popup before browser window closes

I'm using the following js to show a popup before the browser/window closes. But it does not seem to be working.
$(window).bind('beforeunload', function(e) {
$('#beforeclose').click();
});
The popup i'm trying to show is prettyPopin . And the #beforeclose is the id of the anchor with which i'm trying to bind the click event before the window unloads. I have noticed that native js popups work but the jQuery popup does not work.
Is there a way to achieve what i want to? Please do explain to me or refer me to the respective link because i'm not an expert at js.
Thanks in advance.
You cannot safely do that.
onbeforeunload is designed in a way to avoid completely preventing the user from leaving your page. The only thing you should do is return a string with a message why the user might not want to leave the page. This message is displayed to the user unless he's using firefox.
Try this:
<script type="text/javascript">
$(function() {
function confirmmsg() {
return "Mail Not sent";
}
window.onbeforeunload = confirmmsg;
});
</script>
Try changing it to
$(window).bind('beforeunload', function(e) {
$('#beforeclose').click();
e.preventDefault();
return false; // just in case..
});
from jQuery documentation:
event.preventDefault()
Description: If this method is called, the default action of the event
will not be triggered.
Basically, you are binding the function that shows the popup on the beforeunload event, but that does not block the browser like an alert window or something like that. Using event.preventDefault() you will stop the execution of event flow.

$(window).hashchange() doesn't work

Hi,
I'm trying to use the browser back button, i understood how to catch the event with hashchange plugin =>
$(window).hashchange( function(){
alert( location.hash );
});$(window).hashchange();
When i try to load the new page, nothing happens..
Is there a way to "reload" the page with the new url ?
Thanks !
Try this instead:
$(window).on('hashchange', function(){
// Your code goes here
}).trigger('hashchange'); // bind event to the same selector as event-listener
.trigger() basicly activates events manually.
EDIT:
This should be enough for you to work.
Try this piece of code and see if you got any luck.
Included javascript.js is compressed with jquery and hashchange.
Put $(window).bind('hashchange', function() {}); outside of the document.ready

jQuery - click-event is called twice on iPad

I have a problem with my web application which is designed for iPad.
I use jQuery and jQuery UI for dragging elements on the screen. Because on iPad, the element can not be dragged by default, I added this library:
http://code.google.com/p/jquery-ui-for-ipad-and-iphone/
Including it, I can drag and drop elements on iPad, but also a problem occurs. I have on the draggable element also a div are with an image, which should be clickable.
So I integrate these lines:
$(document).ready(function() {
$(".note").draggable();
$('.closebutton').click(function() {
alert("test");
});
});
​
The problem is, including the drag-library, the alert message test pops up twice or the screen is frozen.
I created a full working demo here:
http://jsbin.com/oliwo/2/
On normal desktop browsers, like Firefox 4 Beta and Safari, it works, only one test message appears by clicking with the mouse on the x - delete image. On iPad, I get the message twice or the screen froze.
Does anyone can help me? Thank you a lot in advance & Best Regards.
This is not really a response, as i don't known why you have it twice. But you can try a workaround if you're sure your click event is the only click event behavior that should be attached to this button; Make an unbind() just before you're bind, this will remove any previous click binding (so if this is run several times, you'll get only one event):
$('.closebutton').unbind().click(function() { ...
or better:
$('.closebutton').unbind('click').click(function() { ...
I've found that events get fired twice when showing an alert box on a click. I've managed to overcome this problem by using a setTimeout to show the alert box...
$("#myButton").unbind("click").click(function () {
// Have to use a setTimeout else on iPhone the alert may appear twice in certain scenarios
setTimeout(function () { alert('The message'); }, 300);
return false; // Return false to prevent href being followed
});
I do not know why, but if I do not use alert messages, it will work. I create new elements and then it is only called once, on iPad and Desktop Safari.
I'm seeing this issue only on iPad, perhaps some version of webkit related. The unbind worked for me, and I also read this only exists if jquery code is in the body html tag, if its in head it is not an issue.
just simply avoid the propagation of the click
$("tr").live('click',function() {
...
$( event.toElement ).one('click', function(e){ e.stopImmediatePropagation(); } );
});

Categories

Resources