kd7*_*kd7 209 javascript jquery
我想在用户离开页面之前做出确认.如果他说好,那么它将重定向到新页面或取消离开.我尝试使用onunload来实现它
<script type="text/javascript">
function con() {
var answer = confirm("do you want to check our other products")
if (answer){
alert("bye");
}
else{
window.location = "http://www.example.com";
}
}
</script>
</head>
<body onunload="con();">
<h1 style="text-align:center">main page</h1>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
但它确认页面已经关闭后?怎么做得好?
如果有人用jQuery演示如何做到这一点会更好吗?
Roc*_*mat 331
onunload(或onbeforeunload)无法将用户重定向到另一个页面.这是出于安全原因.
如果要在用户离开页面之前显示提示,请使用onbeforeunload:
window.onbeforeunload = function(){
return 'Are you sure you want to leave?';
};
Run Code Online (Sandbox Code Playgroud)
或者使用jQuery:
$(window).bind('beforeunload', function(){
return 'Are you sure you want to leave?';
});
Run Code Online (Sandbox Code Playgroud)
这只会询问用户是否要离开页面,如果他们选择留在页面上,则无法重定向.如果他们选择离开,浏览器将转到他们告诉它去的地方.
您可以onunload在卸载页面之前使用它来执行操作,但是您无法从那里重定向(Chrome 14+阻止警报内部onunload):
window.onunload = function() {
alert('Bye.');
}
Run Code Online (Sandbox Code Playgroud)
或者使用jQuery:
$(window).unload(function(){
alert('Bye.');
});
Run Code Online (Sandbox Code Playgroud)
Was*_* A. 32
当您检测到表单状态发生变化时,此代码也会发生变化
$('#form').data('serialize',$('#form').serialize()); // On load save form current state
$(window).bind('beforeunload', function(e){
if($('#form').serialize()!=$('#form').data('serialize'))return true;
else e=null; // i.e; if form state change show warning box, else don't show it.
});
Run Code Online (Sandbox Code Playgroud)
您可以使用Google JQuery Form Serialize功能,这将收集所有表单输入并将其保存在数组中.我想这个解释就够了:)
Aji*_*ngh 18
这将在离开当前页面时发出警报
<script type='text/javascript'>
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>
Run Code Online (Sandbox Code Playgroud)
Dav*_*ger 10
要使用Chrome 14+的popop,您需要执行以下操作:
jQuery(window).bind('beforeunload', function(){
return 'my text';
});
Run Code Online (Sandbox Code Playgroud)
将询问用户他是想留下还是离开.
Min*_*tta 10
这就是我在未保存数据时显示确认消息的方法
window.onbeforeunload = function () {
if (isDirty) {
return "There are unsaved data.";
}
return undefined;
}
Run Code Online (Sandbox Code Playgroud)
返回"未定义"将禁用确认
注意:返回"null"将不适用于IE
您也可以使用"undefined"来禁用确认
window.onbeforeunload = undefined;
Run Code Online (Sandbox Code Playgroud)
在离开页面之前,您可以使用以下单行始终询问用户.
window.onbeforeunload = s => "";
Run Code Online (Sandbox Code Playgroud)
要询问用户何时修改了页面上的内容,请参阅此答案.
通常,您希望在用户对表单进行更改但未保存时显示此消息。
采取这种方法来显示消息,仅当用户更改某些内容时
var form = $('#your-form'),
original = form.serialize()
form.submit(function(){
window.onbeforeunload = null
})
window.onbeforeunload = function(){
if (form.serialize() != original)
return 'Are you sure you want to leave?'
}
Run Code Online (Sandbox Code Playgroud)
此处的大多数解决方案对我都不起作用,因此我使用了此处找到的解决方案
我还添加了一个变量来允许确认框与否
window.hideWarning = false;
window.addEventListener('beforeunload', (event) => {
if (!hideWarning) {
event.preventDefault();
event.returnValue = '';
}
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
306592 次 |
| 最近记录: |