diff options
Diffstat (limited to 'files/zh-cn/web/api/windoweventhandlers/onbeforeunload/index.html')
-rw-r--r-- | files/zh-cn/web/api/windoweventhandlers/onbeforeunload/index.html | 111 |
1 files changed, 111 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/windoweventhandlers/onbeforeunload/index.html b/files/zh-cn/web/api/windoweventhandlers/onbeforeunload/index.html new file mode 100644 index 0000000000..78bed99eb9 --- /dev/null +++ b/files/zh-cn/web/api/windoweventhandlers/onbeforeunload/index.html @@ -0,0 +1,111 @@ +--- +title: window.onbeforeunload +slug: Web/API/Window/onbeforeunload +translation_of: Web/API/WindowEventHandlers/onbeforeunload +--- +<div>{{ApiRef}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p>当窗口即将被{{domxref("window.onunload","卸载(关闭)")}}时,会触发该事件.此时页面文档依然可见,且该事件的默认动作可以被{{domxref("event.preventDefault","取消")}}.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">window.onbeforeunload = <var>funcRef</var></pre> + +<ul> + <li><code>funcRef</code> 是一个函数引用</li> + <li>该函数应当将一个说明字符串赋值给<code>Event</code>对象的<code>returnValue</code>属性(兼容旧版浏览器),并且返回该字符串</li> + <li>请注意,在Firefox4及其后续版本中,返回的说明字符串并不向用户显示,也就是无法自定义说明字符串.查看<a class="external link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=588292" title="https://bugzilla.mozilla.org/show_bug.cgi?id=588292">Bug 588292</a>.</li> +</ul> + +<h2 id="Example" name="Example">示例</h2> + +<pre class="brush:js">window.onbeforeunload = function (e) { + e = e || window.event; + + // 兼容IE8和Firefox 4之前的版本 + if (e) { + e.returnValue = '关闭提示'; + } + + // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+ + return '关闭提示'; +}; +</pre> + +<h2 id="附注">附注</h2> + +<p>当该事件返回的字符串(事前设置好的event.returnValue的值)不为null或者undefined时,弹出确认窗口让用户自行选择是否关闭当前页面。一些浏览器将该事件返回的字符串显示在弹出窗上。从Firefox 4、 Chrome 51、Opera 38 和Safari 9.1开始,通用确认信息代替事件返回的字符串。比如,火狐上会显示“本页面要求您确认您要离开 - 您输入的数据可能不会被保存”,请查阅{{bug("588292")}}和<a href="https://www.chromestatus.com/feature/5349061406228480">Chrome Platform Status</a>。</p> + +<p>从2011年5月25日起, <a class="external" href="http://www.w3.org/TR/html5-diff/#changes-2011-05-25" title="http://www.w3.org/TR/html5-diff/#changes-2011-05-25">HTML5 规范</a> 声明:在该事件的处理函数中调用下列弹窗相关的方法时,可以忽略不执行,<code><a class="new" href="https://developer.mozilla.org/zh-CN/docs/DOM/window.showModalDialog">window.showModalDialog()</a></code>, <code><a href="https://developer.mozilla.org/zh-CN/docs/DOM/window.alert">window.alert()</a></code>, <code><a class="new" href="https://developer.mozilla.org/zh-CN/docs/DOM/window.confirm">window.confirm()</a></code> <code><a href="https://developer.mozilla.org/zh-CN/docs/DOM/window.prompt">window.prompt()</a></code>.</p> + +<p>需要指出的是,许多浏览器会忽略该事件并自动关闭页面无需用户的确认。火狐浏览器在配置页面<a>about:config</a>设有一个dom.disable_beforeunload的开关变量用于开启这个功能。</p> + +<p>你可以通过{{domxref("EventTarget.addEventListener","window.addEventListener()")}} 或者 {{event("beforeunload")}} 创建该事件。更多信息请点击以上链接。</p> + +<p>创建这个事件能防止浏览器缓存部分由javascript产生的页面内容。在页面中含Javascript产生的内容情形下,再次导航返回到原页面javascript不在运行。如果事先有window.onbeforeunload事件,导航返回到先前的页面后javascript将被触发并更新页面内容。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>1</td> + <td>4</td> + <td>12</td> + <td>3</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Specification" name="Specification">规范</h2> + +<p><code>该事件最初是由微软公司的IE4引进,虽然没有公开的规范说明,但所有浏览器都支持该事件.</code>目前已被添加至HTML5规范草案中.</p> + +<ul> + <li>{{spec("http://dev.w3.org/html5/spec-LC/history.html#unloading-documents", "HTML5: Browsing the Web, Unloading documents", "LC")}}</li> +</ul> + +<h2 id="See also" name="See also">相关链接</h2> + +<ul> + <li><a href="http://msdn.microsoft.com/zh-CN/library/ms536907(VS.85).aspx">MSDN: onbeforeunload event</a></li> +</ul> |