防止使用 JavaScript 刷新/重新加载页面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7880974/
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
Prevent refreshing / reloading a page with JavaScript
提问by xuso
I know this is not recommended, but I need it because I have an iframe inside the page who has the actual content and I want that when the users hits refresh button, iframe reloads not entire page.
我知道这不是推荐的，但我需要它，因为我在页面中有一个 iframe，它包含实际内容，我希望当用户点击刷新按钮时，iframe 不会重新加载整个页面。
I know I have to call onunload/ onbeforeunloadevent, but I don't want to ask me if I want to leave the window, just don't.
我知道我必须打电话onunload/onbeforeunload事件，但我不想问我是否要离开窗口，只是不要。
Is that possible? I've got handled the F5 key, but I like to prevent refreshing from button too.
那可能吗？我已经处理了 F5 键，但我也喜欢防止从按钮刷新。
回答by Paul J
UPDATE: I wrote this 5 years ago, browsers do different stuff now, you can still use this for testing your browser set, but your experience may vary from my old research.
更新：我 5 年前写过这篇文章，现在浏览器做了不同的事情，你仍然可以用它来测试你的浏览器集，但你的体验可能与我以前的研究有所不同。
Experimenting using jQuery, because I'm lazy.
尝试使用 jQuery，因为我很懒。
Theoretically, preventing the default behavior should stop the event from doing whatever it is supposed to do. It doesn't work with the events in my example and has different results in different browsers. I put the Math.random() in to determine if the page has been reloaded or not. Because different browsers do different things, I highly recommend NOT using this in a production environment.
从理论上讲，阻止默认行为应该阻止事件做它应该做的任何事情。它不适用于我的示例中的事件，并且在不同的浏览器中具有不同的结果。我将 Math.random() 放入以确定页面是否已重新加载。因为不同的浏览器做不同的事情，我强烈建议不要在生产环境中使用它。
<body>
<p></p>
<script type="text/javascript">
$('p').append(Math.random());
$(window).bind({
beforeunload: function(ev) {
ev.preventDefault();
},
unload: function(ev) {
ev.preventDefault();
}
});
</script>
</body>
Using CTRL-R or F5 or Reload Button:
使用 CTRL-R 或 F5 或重新加载按钮：
- Safari: Does nothing
- Chrome: Does nothing
- Opera 10 & 11: Does nothing
- Firefox 7.x: Shows a special prompt with two buttons:
- Stay on Page - Does not reload page
- Leave Page - Reloads the page
- IE7 & IE8: Shows a prompt with two buttons:
- OK - Reloads the page
- Cancel - Does not reload the page
- IE9: Shows a prompt with two buttons:
- Leave this page - reloads
- Stay on this page - does not reload
- Safari：什么都不做
- 铬：什么都不做
- 歌剧 10 和 11：什么都不做
- Firefox 7.x：显示带有两个按钮的特殊提示：
- 留在页面上 - 不重新加载页面
- 离开页面 - 重新加载页面
- IE7 & IE8：显示带有两个按钮的提示：
- OK - 重新加载页面
- 取消 - 不重新加载页面
- IE9：显示带有两个按钮的提示：
- 离开此页面 - 重新加载
- 留在此页面 - 不会重新加载
Firefox Prompt (you can tell I tested it on a Mac)
Firefox Prompt（你可以说我在 Mac 上测试过）
IE7 & IE8 Prompt
IE7 & IE8 提示
IE9 Prompt
IE9 提示
In closing:
最后：
Yes, I did not test IE6, I deleted my VM which had it installed, I don't have a VM with IE10 beta installed, so you're out of luck on that too.
是的，我没有测试 IE6，我删除了我安装了它的 VM，我没有安装 IE10 beta 的 VM，所以你也不走运。
You might also experiment with cancelBubble and stopPropagation or maybe return false; might reveal something useful. I'm down with Jordan's reply that you shouldn't be trying to override the defaults, so I'm concluding my experiment here.
您还可以尝试使用 cancelBubble 和 stopPropagation 或者返回 false；可能会揭示一些有用的东西。我不同意 Jordan 的回答，即您不应该尝试覆盖默认值，所以我在这里结束我的实验。
回答by Lucky
Returning false in an onsubmit event prevents the form from being submitted and stays in the same page without any user interaction..
在 onsubmit 事件中返回 false 会阻止提交表单并保持在同一页面中而无需任何用户交互。
For example..
例如..
when a form having input field is empty and submitted this javascript check for validation and returns accordingly.. If false is returned nothing is done(i.e. page is not refreshed or redirected)..
当具有输入字段的表单为空并提交此 javascript 检查验证并相应返回时.. 如果返回 false 则不执行任何操作（即页面未刷新或重定向）。
If the validation is ok and if true is returned the form action is performed..
如果验证正常并且返回 true，则执行表单操作。
function validateForm(Str) {
mystring=document.getElementById('inputid').value;
if(!mystring.match(/\S/)){
alert ('Please Enter a String.Field cannot be empty');
return false;
}else{
return true;
}
}
