javascript 离开页面时如何使用Jquery显示弹出式调查
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8118722/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to show pop-up survey with Jquery when leaving page
提问by Chuck Norris
I want to show survey in pop-up window when users leaves page.
我想在用户离开页面时在弹出窗口中显示调查。
So I want to leave page only when he answers all the questions of survey and/or close the pop-up window... How can I do that?
所以我只想在他回答调查的所有问题和/或关闭弹出窗口时离开页面......我该怎么做?
I try this code
我试试这个代码
$(document).ready(function () {
function exitpop() {
my_window = window.open("http://www.google.com", "mywindow1", "status=off,toolbar=off,location=off,menubar=off,directories=off,resizable=off,scrollbars=off,height=800,width=800");
});
}
$(window).unload(function () {
exitpop();
});
});
But it blocks by majority of browsers and don't pause clicked action(going to other page or closing the window). What is the best way to do that?
但它会被大多数浏览器阻止并且不会暂停单击操作(转到其他页面或关闭窗口)。最好的方法是什么?
回答by Niranjan Singh
Try Using window.onbeforeunload
event ..
尝试使用window.onbeforeunload
事件..
have an idea from the follow code snippet. i am using this type of code to confirm use to before leaving the page.. means either it is close tab or refresh the page...
从以下代码片段中获得一个想法。我正在使用这种类型的代码在离开页面之前确认使用..意味着它是关闭选项卡或刷新页面......
But you have to track when it is refresh or close.. both means same to beforeunload..
you can't use directly use them either unload
or beforeunload
- they do not differ between window close, Try this may be it will work according to your requirements.
但是你必须跟踪它何时刷新或关闭..两者都意味着相同的 beforeunload.. 你也不能直接使用它们unload
或者beforeunload
- 它们在窗口关闭之间没有区别,试试这可能会根据你的要求工作.
http://docs.jquery.com/Events/unload#fn
http://docs.jquery.com/Events/unload#fn
jQuery:
jQuery:
$(window).unload( function () { alert("Bye now!"); } );
or javascript:
window.onunload = function(){alert("Bye now!");}
For more information follow this: https://developer.mozilla.org/en/DOM/window.onclose
有关更多信息,请参阅:https: //developer.mozilla.org/en/DOM/window.onclose
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function confirmBeforeUnload(e) {
var e = e || window.event;
// For IE and Firefox
if (e) {
e.returnValue = 'Any string';
}
// For Safari
return 'Any string';
}
function goodbye(e) {
if (!e) e = window.event;
//e.cancelBubble is supported by IE - this will kill the bubbling process.
e.cancelBubble = true;
e.returnValue = 'You sure you want to leave?'; //This is displayed on the dialog
//e.stopPropagation works in Firefox.
if (e.stopPropagation) {
e.stopPropagation();
e.preventDefault();
}
}
window.onbeforeunload = goodbye;
</script>
<title>Untitled Document</title>
</head>
<body>
</body>
</html>
open survey content in modal for interaction... follow these links to create modal popup on your page ..
在模态中打开调查内容以进行交互...按照这些链接在您的页面上创建模态弹出窗口..
http://choosedaily.com/1178/15-jquery-popup-modal-dialog-plugins-tutorials/
http://choosedaily.com/1178/15-jquery-popup-modal-dialog-plugins-tutorials/
http://www.queness.com/post/77/simple-jquery-modal-window-tutorial-- follow this step by step tutorial with code to create modal popup..
http://www.queness.com/post/77/simple-jquery-modal-window-tutorial——按照这个分步教程和代码来创建模态弹出窗口..
回答by Dave
Is it necessary to make users fill out a survey? If not, then you could replace the contents of the body so the user sees it in the background.
是否有必要让用户填写调查问卷?如果没有,那么您可以替换正文的内容,以便用户在后台看到它。
var done = 0;
window.onbeforeunload = function() {
if (done != 1) {
done = 1;
document.getElementsByTagName('body')[0].innerHTML = "new content goes here";
return "Howdy there. Why don't you stick around for a moment and take our survey?";
}
}