aboutsummaryrefslogtreecommitdiff
path: root/files/pt-br/web/api/window/popstate_event/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/pt-br/web/api/window/popstate_event/index.html')
-rw-r--r--files/pt-br/web/api/window/popstate_event/index.html144
1 files changed, 144 insertions, 0 deletions
diff --git a/files/pt-br/web/api/window/popstate_event/index.html b/files/pt-br/web/api/window/popstate_event/index.html
new file mode 100644
index 0000000000..55f493f18b
--- /dev/null
+++ b/files/pt-br/web/api/window/popstate_event/index.html
@@ -0,0 +1,144 @@
+---
+title: popstate
+slug: Web/API/Window/popstate_event
+translation_of: Web/API/Window/popstate_event
+---
+<p>O evento <code>popstate </code>é disparado quando a entrada do histórico ativa é alterado. Se o histórico de entrada a ser ativado for criado por uma chamada <code>history.pushState() </code>ou for afetada por uma chamada <code>history.replaceState(),</code> a propriedade dos eventos<code> popstate </code>contém uma cópia do histórico de entrada do objeto.<br>
+ <br>
+ Note  que apenas chamando <code>history.pushState()</code> ou <code>history.replaceState()</code> não ira disparar um evento <code>popstate. </code>O evento <code>popstate </code>apenas é disparado após uma ação no navegador como um click no botão de voltar (ou chamando <code>history.back() por javascript</code>)<br>
+ <br>
+ Navegadores tendem a lidar com o evento <code>popstate </code>diferentemente no carregamento da página. Chrome (anterior versão 34) e Safari sempre emitem um evento <code>popstate</code> no carregamento da página, mas o Firefox não.</p>
+
+<h2 id="Informação_geral">Informação geral</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Especificação</dt>
+ <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#event-popstate">HTML5</a></dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interface</dt>
+ <dd style="margin: 0 0 0 120px;">PopStateEvent</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
+ <dd style="margin: 0 0 0 120px;">Yes</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Alvo</dt>
+ <dd style="margin: 0 0 0 120px;">defaultView</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Ação padrão</dt>
+ <dd style="margin: 0 0 0 120px;">None</dd>
+</dl>
+
+<h2 id="Propriedades">Propriedades</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Property</th>
+ <th scope="col">Type</th>
+ <th scope="col">Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>target</code> {{readonlyInline}}</td>
+ <td>{{domxref("EventTarget")}}</td>
+ <td>The browsing context (<code>window</code>).</td>
+ </tr>
+ <tr>
+ <td><code>type</code> {{readonlyInline}}</td>
+ <td>{{domxref("DOMString")}}</td>
+ <td>The type of event.</td>
+ </tr>
+ <tr>
+ <td><code>bubbles</code> {{readonlyInline}}</td>
+ <td>{{jsxref("Boolean")}}</td>
+ <td>Whether the event normally bubbles or not.</td>
+ </tr>
+ <tr>
+ <td><code>cancelable</code> {{readonlyInline}}</td>
+ <td>{{jsxref("Boolean")}}</td>
+ <td>Whether the event is cancellable or not.</td>
+ </tr>
+ <tr>
+ <td><code>state</code> {{readonlyInline}}</td>
+ <td><em>any</em></td>
+ <td>The current history entry's state object (if any).</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatiblidade_com_navegadores">Compatiblidade com navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<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</th>
+ </tr>
+ <tr>
+ <td>Suporte básico</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatGeckoDesktop("2")}}</td>
+ <td>10.0</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}[1]</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 Mobile</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ </tr>
+ <tr>
+ <td>Suporte básico</td>
+ <td>3.0[2]</td>
+ <td>{{CompatGeckoMobile("2")}}</td>
+ <td>10.0</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}[1]</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] A implementação tem um suporte limitado.</p>
+
+<p>[2] A implementação em Android 2.2 e 2.3 tem problemas.</p>
+
+<h2 id="Exemplo">Exemplo</h2>
+
+<p>Um página no <code>http://example.com/example.html roda o código abaixo e irá gerar os logs indicados</code></p>
+
+<pre class="brush: js">window.onpopstate = function(event) {
+ console.log("location: " + document.location + ", state: " + JSON.stringify(event.state));
+};
+history.pushState({page: 1}, "title 1", "?page=1");
+history.pushState({page: 2}, "title 2", "?page=2");
+history.replaceState({page: 3}, "title 3", "?page=3");
+history.back(); // Logs "location: http://example.com/example.html?page=1, state: {"page":1}"
+history.back(); // Logs "location: http://example.com/example.html, state: null
+history.go(2); // Logs "location: http://example.com/example.html?page=3, state: {"page":3}
+</pre>
+
+<p>Observe que mesmo que a entrada do histórico inicial(para <code>http://example.com/example.html</code>) não tem nenhum estado associado a ele, um evento <code>popstate </code>é ainda disparado quando nós ativamos essa entrada após a segunda chamada para<code> history.back ().</code><br>
+  </p>
+
+<h2 id="Eventos_relacionados">Eventos relacionados</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Mozilla_event_reference/hashchange"><code>hashchange</code></a></li>
+</ul>