diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
commit | 074785cea106179cb3305637055ab0a009ca74f2 (patch) | |
tree | e6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/pt-br/web/api/event | |
parent | da78a9e329e272dedb2400b79a3bdeebff387d47 (diff) | |
download | translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2 translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip |
initial commit
Diffstat (limited to 'files/pt-br/web/api/event')
-rw-r--r-- | files/pt-br/web/api/event/comparativo_entre_event_targets/index.html | 167 | ||||
-rw-r--r-- | files/pt-br/web/api/event/currenttarget/index.html | 129 | ||||
-rw-r--r-- | files/pt-br/web/api/event/defaultprevented/index.html | 79 | ||||
-rw-r--r-- | files/pt-br/web/api/event/event/index.html | 69 | ||||
-rw-r--r-- | files/pt-br/web/api/event/index.html | 146 | ||||
-rw-r--r-- | files/pt-br/web/api/event/initevent/index.html | 137 | ||||
-rw-r--r-- | files/pt-br/web/api/event/istrusted/index.html | 57 | ||||
-rw-r--r-- | files/pt-br/web/api/event/preventdefault/index.html | 113 | ||||
-rw-r--r-- | files/pt-br/web/api/event/srcelement/index.html | 74 | ||||
-rw-r--r-- | files/pt-br/web/api/event/stopimmediatepropagation/index.html | 99 | ||||
-rw-r--r-- | files/pt-br/web/api/event/stoppropagation/index.html | 93 | ||||
-rw-r--r-- | files/pt-br/web/api/event/target/index.html | 69 | ||||
-rw-r--r-- | files/pt-br/web/api/event/type/index.html | 60 |
13 files changed, 1292 insertions, 0 deletions
diff --git a/files/pt-br/web/api/event/comparativo_entre_event_targets/index.html b/files/pt-br/web/api/event/comparativo_entre_event_targets/index.html new file mode 100644 index 0000000000..e9b2004719 --- /dev/null +++ b/files/pt-br/web/api/event/comparativo_entre_event_targets/index.html @@ -0,0 +1,167 @@ +--- +title: Comparativo entre Event Targets +slug: Web/API/Event/Comparativo_entre_Event_Targets +tags: + - DOM + - Event + - event target +translation_of: Web/API/Event/Comparison_of_Event_Targets +--- +<div>{{ ApiRef() }}</div> + +<h3 id="Event_targets">Event targets</h3> + +<p>É facil se confundir sobre o tipo de alvo (<em>target</em>) que deseja-se examinar ao criar um manipulador de eventos (<em>event handler</em>). Este artigo se propõe a esclarecer o uso da propriedade <em>target</em>.</p> + +<p>Há 5 tipos de <em>targets</em> a se considerar:</p> + +<table class="standard-table"> + <tbody> + <tr> + <th>Propriedade</th> + <th>Definido em</th> + <th>Objetivo</th> + </tr> + <tr> + <td><a href="/en/DOM/event.target" title="en/DOM/event.target">event.target</a></td> + <td><a class="external" href="http://www.w3.org/TR/DOM-Level-2/events.html#Events-interface">DOM Event Interface</a></td> + <td> + <p>O elemento do DOM à esquerda da chamada que disparou este evento, por exemplo:</p> + + <pre class="eval"> +<em>element</em>.dispatchEvent(<em>event</em>) +</pre> + </td> + </tr> + <tr> + <td><a href="/en/DOM/event.currentTarget" title="en/DOM/event.currentTarget">event.currentTarget</a></td> + <td><a class="external" href="https://www.w3.org/TR/DOM-Level-2/events.html#Events-interface">DOM Event Interface</a></td> + <td>O <a class="external" href="http://www.w3.org/TR/DOM-Level-2/events.html#Events-EventTarget"><code>EventTarget</code></a> do qual o <a class="external" href="http://www.w3.org/TR/DOM-Level-2/events.html#Events-EventListener"><code>EventListeners</code></a> está sendo atualmente processado. Logo que a captura e a subida do evento ocorre a mudança deste valor.</td> + </tr> + <tr> + <td><a href="/en/DOM/event.relatedTarget" title="en/DOM/event.relatedTarget">event.relatedTarget</a></td> + <td><a class="external" href="http://www.w3.org/TR/DOM-Level-2/events.html#Events-MouseEvent">DOM MouseEvent Interface</a></td> + <td>Identifica um alvo secundário para o evento.</td> + </tr> + <tr> + <td><a href="/en/DOM/event.explicitOriginalTarget" title="en/DOM/event.explicitOriginalTarget">event.explicitOriginalTarget</a></td> + <td>{{ Source("/dom/public/idl/events/nsIDOMNSEvent.idl", "nsIDOMNSEvent.idl") }}</td> + <td>{{ Non-standard_inline() }} Se o evento foi redirecionado por alguma outra razão senão o cruzamento de uma fronteira anônima, este evento será colocado no alvo antes que o redirecionamento ocorra. por exemplo, eventos do mouse são redirecionados à seus elementos pais quando acontecem sobre nós de texto ({{ Bug("185889") }}), e neste caso .target mostrará o nó pai e <code>.explicitOriginalTarget</code> mostrará o nó texto. Diferente de <code>.originalTarget</code>, <code>.explicitOriginalTarget</code> nunca irá conter um conteúdo anônimo.</td> + </tr> + <tr> + <td><a href="/en/DOM/event.originalTarget" title="en/DOM/event.originalTarget">event.originalTarget</a></td> + <td>{{ Source("/dom/public/idl/events/nsIDOMNSEvent.idl", "nsIDOMNSEvent.idl") }}</td> + <td>{{ Non-standard_inline() }} O alvo original do evento, antes de qualquer redirecionamento. Veja <a href="/en-US/docs/XBL/XBL_1.0_Reference/Anonymous_Content#Event_Flow_and_Targeting" title="en/XBL/XBL_1.0_Reference/Anonymous_Content#Event_Flow_and_Targeting">Anonymous Content#Event_Flow_and_Targeting</a> para mais detalhes.</td> + </tr> + </tbody> +</table> + +<h3 id="Uso_de_explicitOriginalTarget_e_originalTarget">Uso de <code>explicitOriginalTarget</code> e <code>originalTarget</code></h3> + +<p>TODO: Disponível apensas em navegadores Mozilla-based?</p> + +<p>TODO: Adequado apenas para desenvolvedores de extensões?</p> + +<h3 id="Exemplos">Exemplos</h3> + +<pre><!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>Comparison of Event Targets</title> + <style> + table { + border-collapse: collapse; + height: 150px; + width: 100%; + } + td { + border: 1px solid #ccc; + font-weight: bold; + padding: 5px; + min-height: 30px; + } + .standard { + background-color: #99ff99; + } + .non-standard { + background-color: #902D37; + } + </style> +</head> +<body> + <table> + <thead> + <tr> + <td class="standard">Original target dispatching the event <small>event.target</small></td> + <td class="standard">Target who's event listener is being processed <small>event.currentTarget</small></td> + <td class="standard">Identify other element (if any) involved in the event <small>event.relatedTarget</small></td> + <td class="non-standard">If there was a retargetting of the event for some reason <small> event.explicitOriginalTarget</small> contains the target before retargetting (never contains anonymous targets)</td> + <td class="non-standard">If there was a retargetting of the event for some reason <small> event.originalTarget</small> contains the target before retargetting (may contain anonymous targets)</td> + </tr> + </thead> + <tr> + <td id="target"></td> + <td id="currentTarget"></td> + <td id="relatedTarget"></td> + <td id="explicitOriginalTarget"></td> + <td id="originalTarget"></td> + </tr> +</table> +<p>Clicking on the text will show the difference between explicitOriginalTarget, originalTarget and target</p> +<script> + function handleClicks(e) { + document.getElementById('target').innerHTML = e.target; + document.getElementById('currentTarget').innerHTML = e.currentTarget; + document.getElementById('relatedTarget').innerHTML = e.relatedTarget; + document.getElementById('explicitOriginalTarget').innerHTML = e.explicitOriginalTarget; + document.getElementById('originalTarget').innerHTML = e.originalTarget; + } + + function handleMouseover(e) { + document.getElementById('target').innerHTML = e.target; + document.getElementById('relatedTarget').innerHTML = e.relatedTarget; + } + + document.addEventListener('click', handleClicks, false); + document.addEventListener('mouseover', handleMouseover, false); +</script> +</body> +</html></pre> + +<h3 id="Uso_de_target_e_relatedTarget">Uso de <code>target</code> e <code>relatedTarget</code></h3> + +<p>A propriedade <code>relatedTarget</code> do evento de <code>mouseover</code> mantém o nó de onde o mouse estava sobre anteriormente. Para o evento de <code>mouseout</code>, mantém o nó para onde o mouse se moveu.</p> + +<table class="standard-table"> + <tbody> + <tr> + <th>Tipo de Evento</th> + <th><a href="/en/DOM/event.target" title="en/DOM/event.target">event.target</a></th> + <th><a href="/en/DOM/event.relatedTarget" title="en/DOM/event.relatedTarget">event.relatedTarget</a></th> + </tr> + <tr> + <td><code>mouseover</code></td> + <td>O EventTarget do qual o dispositivo apontador entrou.</td> + <td>O EventTarget do qual o dispositivo apontador saiu.</td> + </tr> + <tr> + <td><code>mouseout</code></td> + <td>O EventTarget do qual o dispositivo apontador saiu.</td> + <td>O EventTarget do qual o dispositivo apontador entrou.</td> + </tr> + </tbody> +</table> + +<p>TODO: Necessário descrição complemento sobre eventos de <code>dragenter</code> e <code>dragexit</code>.</p> + +<h4 id="Exemplo">Exemplo</h4> + +<pre class="eval"><hbox id="outer"> + <hbox id="inner" + onmouseover="dump('mouseover ' + event.relatedTarget.id + ' > ' + event.target.id + '\n');" + onmouseout="dump('mouseout ' + event.target.id + ' > ' + event.relatedTarget.id + '\n');" + style="margin: 100px; border: 10px solid black; width: 100px; height: 100px;" /> +</hbox> +</pre> diff --git a/files/pt-br/web/api/event/currenttarget/index.html b/files/pt-br/web/api/event/currenttarget/index.html new file mode 100644 index 0000000000..e74a58fb61 --- /dev/null +++ b/files/pt-br/web/api/event/currenttarget/index.html @@ -0,0 +1,129 @@ +--- +title: Event.currentTarget +slug: Web/API/Event/currentTarget +tags: + - API + - CompatibilidadeEntreNavegadores + - DOM + - Gecko + - Propriedade +translation_of: Web/API/Event/currentTarget +--- +<p>{{APIRef("DOM")}}</p> + +<p>Identifica o alvo atual para o evento quando o event percorre o DOM. O currentTarget sempre se refere ao elemento associado ao event handler, ao invés do event.target que identifica o elemento ao qual o evento ocorreu.</p> + +<h2 id="Exemplo">Exemplo</h2> + +<p><code>event.currentTarget</code> é bom para ser usado quando nós queremos associar o mesmo event handler para vários elementos.</p> + +<pre class="brush: js">function hide(e){ + e.currentTarget.style.visibility = "hidden"; + console.log(e.currentTarget); + // Quando essa função é usada como um event + // handler: this === e.currentTarget +} + +var ps = document.getElementsByTagName('p'); + +for(var i = 0; i < ps.length; i++){ + // console: print the clicked <p> element + ps[i].addEventListener('click', hide, false); +} +// console: print <body> +document.body.addEventListener('click', hide, false); + +// Clique e faça os parágrafos desaparecerem +</pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>Especificação</th> + <th>Status</th> + <th>Comentário</th> + </tr> + <tr> + <td>{{SpecName("DOM WHATWG", "#dom-event-currenttarget", "Event.currentTarget")}}</td> + <td>{{Spec2("DOM WHATWG")}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("DOM4", "#dom-event-currenttarget", "Event.currentTarget")}}</td> + <td>{{Spec2("DOM4")}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("DOM3 Events", "#dfn-current-event-target", "current event target")}}</td> + <td>{{Spec2("DOM3 Events")}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("DOM2 Events", "#Events-Event-currentTarget", "Event.currentTarget")}}</td> + <td>{{Spec2("DOM2 Events")}}</td> + <td>Definição incial</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_dos_navegadores">Compatibilidade dos navegadores</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Supote básico</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + <td>{{CompatVersionUnknown}}</td> + <td>10.0</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Supote básico</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>10.0</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Do Internet Explorer 6 até o 8, o modelo do event é diferente. Event listeners estão acoplados com o {{domxref("EventTarget.attachEvent")}} método não padronizado. Neste modelo não há um equivalente para <code>event.currentTarget</code> e <code>this</code> é um objeto global. Uma solução para simular o <code>event.currentTarget</code> é envolver seu handler em uma função e chamando-a usando o <code>Function.prototype.call</code> com o elemento sendo o primeiro argumento. Desta forma, <code>this</code> será o valor esperado.</p> + +<h2 id="Veja_também">Veja também</h2> + +<p><a href="/en-US/docs/Web/API/Event/Comparison_of_Event_Targets">Comparativo dos Event Targets</a></p> diff --git a/files/pt-br/web/api/event/defaultprevented/index.html b/files/pt-br/web/api/event/defaultprevented/index.html new file mode 100644 index 0000000000..d0407443c7 --- /dev/null +++ b/files/pt-br/web/api/event/defaultprevented/index.html @@ -0,0 +1,79 @@ +--- +title: Event.defaultPrevented +slug: Web/API/Event/defaultPrevented +translation_of: Web/API/Event/defaultPrevented +--- +<p>{{ ApiRef("DOM") }}</p> + +<h3 id="Resumo">Resumo</h3> + +<p><span class="short_text" id="result_box" lang="pt"><span class="hps">Retorna um booleano</span> <span class="hps">que indica se</span> <span class="hps">ou não</span></span> {{ domxref("event.preventDefault()") }} foi chamado no evento.</p> + +<div class="note"><strong>Nota:</strong> <span id="result_box" lang="pt"><span class="hps">Você deve usar</span> <span class="hps">isso em vez de</span> <span class="hps">a</span> <span class="hps">não-padrão,</span> método <span class="hps">desatualizado</span></span><code> getPreventDefault()</code> (ver {{ bug(691151) }}).</div> + +<h3 id="Sintaxe">Sintaxe</h3> + +<pre class="eval">bool = event.defaultPrevented </pre> + +<h3 id="Exemplo">Exemplo</h3> + +<pre> if (e.defaultPrevented) { + /* <span class="short_text" id="result_box" lang="pt"><span class="hps">o padrão</span> <span class="hps">foi impedido</span></span> */ + } +</pre> + +<h3 id="Compatibilidade_do_navegador"><span class="short_text" id="result_box" lang="pt"><span class="hps">Compatibilidade do navegador</span></span></h3> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Recurso</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>{{ CompatChrome(18) }}</td> + <td>{{ CompatGeckoDesktop("6.0") }}</td> + <td>{{ CompatIE(9.0) }}</td> + <td>{{ CompatOpera(11.0) }}</td> + <td>{{ CompatSafari("5.0") }}</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>{{ CompatUnknown() }}</td> + <td>{{ CompatGeckoMobile("6.0") }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatSafari(5.0) }}</td> + </tr> + </tbody> +</table> +</div> + +<h3 id="Especificação">Especificação</h3> + +<ul> + <li><a class="external" href="http://www.w3.org/TR/2006/WD-DOM-Level-3-Events-20060413/events.html#Events-Event-defaultPrevented" title="http://www.w3.org/TR/2006/WD-DOM-Level-3-Events-20060413/events.html#Events-Event-defaultPrevented">Eventos DOM 3</a></li> +</ul> diff --git a/files/pt-br/web/api/event/event/index.html b/files/pt-br/web/api/event/event/index.html new file mode 100644 index 0000000000..40bc836e77 --- /dev/null +++ b/files/pt-br/web/api/event/event/index.html @@ -0,0 +1,69 @@ +--- +title: Event() +slug: Web/API/Event/Event +translation_of: Web/API/Event/Event +--- +<p>{{APIRef("DOM")}}</p> + +<p>O <code><strong>Event()</strong></code> cria uma nova {{domxref("Event")}}.</p> + +<h2 id="Sintaxe">Sintaxe</h2> + +<pre class="syntaxbox"> <em>event</em> = new Event(<em>typeArg</em>, <em>eventInit</em>);</pre> + +<h3 id="Valores">Valores</h3> + +<dl> + <dt><em>typeArg</em></dt> + <dd>É uma {{domxref("DOMString")}} representa o nome do evento.</dd> + <dt><em>eventInit</em>{{optional_inline}}</dt> +</dl> + +<dl> + <dd>É um dicionário <code>EventInit</code>, tendo os seguintes campos: + + <ul> + <li><code>"bubbles"</code>, opcional e false por default, do tipo {{jsxref("Boolean")}}, indica se o evento é bubbles ou não.</li> + <li><code>"cancelable"</code>, opcional e false por default, do tipo {{jsxref("Boolean")}}, indica se o evento pode ser cancelado ou não.</li> + </ul> + </dd> +</dl> + +<h2 id="Exemplo">Exemplo</h2> + +<pre class="brush: js">// criar um evento com bubbles true e que não pode ser cancelado + +var ev = new Event("look", {"bubbles":true, "cancelable":false}); +document.dispatchEvent(ev); +</pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table" style="height: 49px; width: 1000px;"> + <thead> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Status</th> + <th scope="col">Comentário</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('DOM WHATWG','#interface-event','Event()')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td>Definição inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_de_browser">Compatibilidade de browser</h2> + + + +<p>{{Compat("api.Event.Event")}}</p> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li>{{domxref("Event")}}</li> +</ul> diff --git a/files/pt-br/web/api/event/index.html b/files/pt-br/web/api/event/index.html new file mode 100644 index 0000000000..7fe5549c48 --- /dev/null +++ b/files/pt-br/web/api/event/index.html @@ -0,0 +1,146 @@ +--- +title: Event +slug: Web/API/Event +tags: + - API + - DOM + - Event + - Interface + - NeedsTranslation + - Reference + - Référence(2) + - TopicStub +translation_of: Web/API/Event +--- +<p>{{APIRef("DOM")}}</p> + +<p>A interface de <strong>eventos</strong> representa qualquer evento de DOM. Ele contém propriedades comuns e métodos para qualquer evento.</p> + +<p>Um monte de outras interfaces herdam, diretamente ou não, a partir desta interface base:</p> + +<div class="index"> +<ul> + <li>{{domxref("AnimationEvent")}}</li> + <li>{{domxref("AudioProcessingEvent")}}</li> + <li>{{domxref("BeforeInputEvent")}}</li> + <li>{{domxref("BeforeUnloadEvent")}}</li> + <li>{{domxref("BlobEvent")}}</li> + <li>{{domxref("ClipboardEvent")}}</li> + <li>{{domxref("CloseEvent")}}</li> + <li>{{domxref("CompositionEvent")}}</li> + <li>{{domxref("CSSFontFaceLoadEvent")}}</li> + <li>{{domxref("CustomEvent")}}</li> + <li>{{domxref("DeviceLightEvent")}}</li> + <li>{{domxref("DeviceMotionEvent")}}</li> + <li>{{domxref("DeviceOrientationEvent")}}</li> + <li>{{domxref("DeviceProximityEvent")}}</li> + <li>{{domxref("DOMTransactionEvent")}}</li> + <li>{{domxref("DragEvent")}}</li> + <li>{{domxref("EditingBeforeInputEvent")}}</li> + <li>{{domxref("ErrorEvent")}}</li> + <li>{{domxref("FocusEvent")}}</li> + <li>{{domxref("GamepadEvent")}}</li> + <li>{{domxref("HashChangeEvent")}}</li> + <li>{{domxref("IDBVersionChangeEvent")}}</li> + <li>{{domxref("InputEvent")}}</li> + <li>{{domxref("KeyboardEvent")}}</li> + <li>{{domxref("MediaStreamEvent")}}</li> + <li>{{domxref("MessageEvent")}}</li> + <li>{{domxref("MouseEvent")}}</li> + <li>{{domxref("MutationEvent")}}</li> + <li>{{domxref("OfflineAudioCompletionEvent")}}</li> + <li>{{domxref("PageTransitionEvent")}}</li> + <li>{{domxref("PointerEvent")}}</li> + <li>{{domxref("PopStateEvent")}}</li> + <li>{{domxref("ProgressEvent")}}</li> + <li>{{domxref("RelatedEvent")}}</li> + <li>{{domxref("RTCDataChannelEvent")}}</li> + <li>{{domxref("RTCIdentityErrorEvent")}}</li> + <li>{{domxref("RTCIdentityEvent")}}</li> + <li>{{domxref("RTCPeerConnectionIceEvent")}}</li> + <li>{{domxref("SensorEvent")}}</li> + <li>{{domxref("StorageEvent")}}</li> + <li>{{domxref("SVGEvent")}}</li> + <li>{{domxref("SVGZoomEvent")}}</li> + <li>{{domxref("TimeEvent")}}</li> + <li>{{domxref("TouchEvent")}}</li> + <li>{{domxref("TrackEvent")}}</li> + <li>{{domxref("TransitionEvent")}}</li> + <li>{{domxref("UIEvent")}}</li> + <li>{{domxref("UserProximityEvent")}}</li> + <li>{{domxref("WheelEvent")}}</li> +</ul> +</div> + +<h2 id="Properties" name="Properties">Construtor</h2> + +<dl> + <dt>{{domxref("Event.Event", "Event()")}}</dt> + <dd>Cria um objeto Event.</dd> +</dl> + +<h2 id="Properties" name="Properties">Propriedades</h2> + +<p><em>Esta interface não herda nenhuma propriedade.</em></p> + +<dl> + <dt>{{domxref("Event.bubbles")}} {{readonlyinline}}</dt> + <dd>Um booleano que indica se o evento surge em bolha pela DOM ou não.</dd> + <dt>{{domxref("Event.cancelable")}} {{readonlyinline}}</dt> + <dd>Um booleano que indica se o evento é cancelado.</dd> + <dt>{{domxref("Event.currentTarget")}} {{readonlyinline}}</dt> + <dd>Uma referencia para o alvo registrado atualmente para o evento.</dd> + <dt>{{domxref("Event.defaultPrevented")}} {{readonlyinline}}</dt> + <dd>Indica se ou não {{domxref("event.preventDefault()")}} foi chamado no evento..</dd> + <dt>{{domxref("Event.eventPhase")}} {{readonlyinline}}</dt> + <dd>Indica que fase do fluxo de eventos está a ser processada.</dd> + <dt>{{domxref("Event.explicitOriginalTarget")}} {{non-standard_inline}} {{readonlyinline}}</dt> + <dd>O objetivo original explícito do evento (Mozilla-specific).</dd> + <dt>{{domxref("Event.originalTarget")}} {{non-standard_inline}} {{readonlyinline}}</dt> + <dd>O objectivo inicial do evento, antes de qualquer redirecionamento (Mozilla-specific).</dd> + <dt>{{domxref("Event.target")}} {{readonlyinline}}</dt> + <dd>A referência ao objectivo para o qual o evento foi originalmente despachado.</dd> + <dt>{{domxref("Event.timeStamp")}} {{readonlyinline}}</dt> + <dd>O tempo em que o evento foi criado.</dd> + <dt>{{domxref("Event.type")}} {{readonlyinline}}</dt> + <dd>O nome do evento (case-insensitive).</dd> + <dt>{{domxref("Event.isTrusted")}} {{readonlyinline}}</dt> + <dd>Indica se ou não o evento foi iniciado pelo navegador (depois de um clique do usuário, por exemplo) ou por um script (usando um método de criação de evento, como <a href="/en-US/docs/DOM/event.initEvent">event.initEvent</a>)</dd> +</dl> + +<h2 id="Methods" name="Methods">Metodos</h2> + +<p><em>Esta interface não herda nenhum método.</em></p> + +<dl> + <dt>{{domxref("Event.initEvent()")}} {{deprecated_inline}}</dt> + <dd>Inicializa o valor de um evento criado. Se o evento já está sendo despachado, este método não faz nada.</dd> + <dt>{{domxref("Event.preventBubble()")}} {{non-standard_inline}} {{Obsolete_inline(24)}}</dt> + <dd>Impede o evento de borbulhar. Obsoleto, use {{domxref ("event.stopPropagation")}} em vez disso.</dd> + <dt>{{domxref("Event.preventCapture()")}} {{non-standard_inline}} {{Obsolete_inline(24)}}</dt> + <dd>Obsoleto, use {{domxref("event.stopPropagation")}} ao invés.</dd> + <dt>{{domxref("Event.preventDefault()")}}</dt> + <dd>Cancela o evento (caso seja cancelável).</dd> + <dt>{{domxref("Event.stopImmediatePropagation()")}}</dt> + <dd>Para este evento em particular, nenhum outro ouvinte será chamado. Ou aqueles ligados no mesmo elemento, nem aqueles associados em elementos que serão percorridos mais tarde<br> + (em fase de captura, por exemplo).</dd> + <dt>{{domxref("Event.stopPropagation()")}}</dt> + <dd>Para a propagação de eventos mais adiante no DOM.</dd> + <dt>{{domxref("Event.getPreventDefault()")}} {{non-standard_inline}}</dt> + <dd>Obsoleto, use {{domxref("Event.defaultPrevented")}} ao invés.</dd> +</dl> + +<h2 id="See_also" name="See_also">Veja também</h2> + +<ul> + <li>Tipos de eventos disponíveis: <a href="/en-US/docs/Web/Reference/Events">Referência de eventos</a></li> + <li><a href="/en-US/docs/Web/API/Event/Comparison_of_Event_Targets">Comparitivo dos Alvos de Eventos</a> (target vs currentTarget vs relatedTarget vs originalTarget)</li> + <li><a href="/en-US/docs/Web/Guide/DOM/Events/Creating_and_triggering_events">Criação e gatilho de eventos customizados</a></li> + <li>Para desenvolvedores de extensões para o Firefox: + <ul> + <li><a href="/en-US/docs/Listening_to_events_in_Firefox_extensions">Escutando eventos em extensões do Firefox</a></li> + <li><a href="/en-US/docs/Listening_to_events_on_all_tabs">Escutando eventos em todas as abas</a></li> + </ul> + </li> + <li><a class="link-https" href="https://wiki.mozilla.org/Events">Eventos relacionados da Mozilla na vida real em wiki.mozilla.org</a></li> +</ul> diff --git a/files/pt-br/web/api/event/initevent/index.html b/files/pt-br/web/api/event/initevent/index.html new file mode 100644 index 0000000000..6a26dcb3e8 --- /dev/null +++ b/files/pt-br/web/api/event/initevent/index.html @@ -0,0 +1,137 @@ +--- +title: Event.initEvent() +slug: Web/API/Event/initEvent +tags: + - API + - DOM + - Descontinuado + - Evento + - Referencia + - metodo +translation_of: Web/API/Event/initEvent +--- +<div>{{ ApiRef("DOM") }}{{deprecated_header}}</div> + +<p>O método <strong><code>Event.initEvent()</code></strong> é usado para inicializar o valor de um {{ domxref("event") }} criado usando {{ domxref("Document.createEvent()") }}.</p> + +<p>Eventos inicializados desta maneira precisam ter sido criados com o método {{ domxref("Document.createEvent()") }}. Este método precisar ser chamado para definir o evento antes de ser despachado, usando {{ domxref("EventTarget.dispatchEvent()") }}. Uma vez despachado, não faz mais nada.</p> + +<div class="note"> +<p><strong>Não use esse método mais, pois está depreciado.</strong></p> + +<p>Ao invés, use construtores de eventos específicos, como {{domxref("Event.Event", "Event()")}}. A página sobre <a href="/en-US/docs/Web/Guide/Events/Creating_and_triggering_events">Criando e disparando eventos</a> detalha mais informações sobre o uso desses eventos.</p> +</div> + +<h2 id="Syntax" name="Syntax">Syntax</h2> + +<pre class="syntaxbox"><em>event</em>.initEvent(<em>tipo</em>, <em>bubbles</em>, <em>cancelable</em>);</pre> + +<dl> + <dt><em><code>tipo</code></em></dt> + <dd>É um {{domxref("DOMString")}} definido o tipo do evento.</dd> + <dt><em><code>bolhas</code></em></dt> + <dd>É um {{jsxref("Boolean")}} decidindo se o evento precisa ser enviado para cima, na cadeia de eventos ou não. Uma vez definido, a propriedade read-only {{ domxref("Event.bubbles") }} irá informar o seu valor.</dd> + <dt><em><code>cancelable</code></em></dt> + <dd>É um {{jsxref("Boolean")}} definindo se o evento pode ser cancelado. Uma vez definido, a propriedade read-only {{ domxref("Event.cancelable") }} will irá informar o seu valor.</dd> +</dl> + +<h2 id="Example" name="Example">Exemplo</h2> + +<pre><code>// Cria o evento. +var event = document.createEvent('Event'); +</code> +// Cria um evento de clique que borbulha e +// não pode ser cancelado<code> +event.initEvent('click', true, false); + +// Escuta este evento. +elem.addEventListener('click', function (e) { + // e.target matches elem +}, false); + +elem.dispatchEvent(event);</code> +</pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Estado</th> + <th scope="col">Comentário</th> + </tr> + <tr> + <td>{{SpecName('DOM WHATWG', '#dom-event-initevent','Event.initEvent()')}}</td> + <td>{{Spec2("DOM WHATWG")}}</td> + <td>From {{SpecName('DOM2 Events')}}, deprecated it, superseded by event constructors.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','##Events-Event-initEvent','Event.initEvent()')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidade com navegadores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Edge</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown()}} [1]</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>Edge</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatUnknown() }} [1]</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Antes do Firefox 17, uma chamada a este método depois de despachar o evento gerava uma exceção ao invés de não fazer nada.</p> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li>O construtor para usar ao invés deste método descontinuado: {{domxref("Event.Event", "Event()")}}. Construtores mais específicos também podem ser usados.</li> +</ul> diff --git a/files/pt-br/web/api/event/istrusted/index.html b/files/pt-br/web/api/event/istrusted/index.html new file mode 100644 index 0000000000..711fcae44b --- /dev/null +++ b/files/pt-br/web/api/event/istrusted/index.html @@ -0,0 +1,57 @@ +--- +title: Event.isTrusted +slug: Web/API/Event/isTrusted +translation_of: Web/API/Event/isTrusted +--- +<div>{{APIRef("DOM")}}<br> +A propriedade <strong><code>isTrusted</code></strong> da interface {{domxref("Event")}}, exclusiva para leitura, é uma booleana ({{domxref("Boolean")}}) de valor verdadeiro (<code>true</code>) se tal evento é disparado pela ação do usuário. Retorna falso (<code>false</code>) caso o acionamento do evento seja ocasionado pelo método {{domxref("EventTarget.dispatchEvent()")}} ou tenha sido criado ou modificado por um script.</div> + +<div> </div> + +<h2 id="Sintaxe">Sintaxe</h2> + +<pre class="syntaxbox">var <em>eventIsTrusted</em> = <em>event</em>.isTrusted; +</pre> + +<h3 id="Valor">Valor</h3> + +<p>{{domxref("Boolean")}}</p> + +<h2 id="Exemplo">Exemplo</h2> + +<pre class="brush: js">if (e.isTrusted) { + /* The event is trusted */ +} else { + /* The event is not trusted */ +} +</pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especifiação</th> + <th scope="col">Status</th> + <th scope="col">Comentário</th> + </tr> + <tr> + <td>{{SpecName('DOM WHATWG', '#dom-event-istrusted', 'Event.isTrusted')}}</td> + <td>{{ Spec2('DOM WHATWG') }}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('DOM3 Events', '#trusted-events', 'Trusted events')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Amplia requisito para confiabilidade de um evento, embora isto não defina por si só a propriedade <code>isTrusted</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Navegadores_e_Compatibilidade">Navegadores e Compatibilidade</h2> + +<div> +<div class="hidden">A tabela de compatibilidade é gerada a partir de dados estruturados. Caso queira contribuir-lhes, por favor, verifique <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e enviel-nos um pull request.</div> + +<p>{{Compat("api.Event.isTrusted")}}</p> +</div> diff --git a/files/pt-br/web/api/event/preventdefault/index.html b/files/pt-br/web/api/event/preventdefault/index.html new file mode 100644 index 0000000000..cc39be846e --- /dev/null +++ b/files/pt-br/web/api/event/preventdefault/index.html @@ -0,0 +1,113 @@ +--- +title: Event.preventDefault() +slug: Web/API/Event/preventDefault +translation_of: Web/API/Event/preventDefault +--- +<div>{{ ApiRef("DOM") }}</div> + +<div> </div> + +<h2 id="Summary" name="Summary">Resumo</h2> + +<p>Cancela o evento se for cancelável, sem parar a propagação do mesmo.</p> + +<h2 id="Syntax" name="Syntax">Sintaxe</h2> + +<pre class="syntaxbox"><em>event</em>.preventDefault();</pre> + +<h2 id="Example" name="Example">Exemplo</h2> + +<p>Alternar é a ação padrão de clicar em uma caixa de seleção. Este exemplo demonstra como impedir que isso aconteça:</p> + +<pre class="brush: html"><!DOCTYPE html> +<html> +<head> +<title>preventDefault example</title> + +<script> +function stopDefAction(evt) { + evt.preventDefault(); +} + +document.getElementById('my-checkbox').addEventListener( + 'click', stopDefAction, false +); +</script> +</head> + +<body> + +<p>Please click on the checkbox control.</p> + +<form> + <input type="checkbox" id="my-checkbox" /> + <label for="my-checkbox">Checkbox</label> +</form> + +</body> +</html></pre> + +<p>Você pode ver o <code>preventDefault</code> em ação <a class="internal" href="/samples/domref/dispatchEvent.html" title="samples/domref/dispatchEvent.html">aqui</a>.</p> + +<p>O exemplo a seguir demonstra como um input com texto inválido pode ser parado ao chegar ao campo de entrada com o preventDefault().</p> + +<div id="preventDefault_invalid_text"> +<pre class="brush: html"><!DOCTYPE html> +<html> +<head> +<title>preventDefault example</title> + +<script> +</pre> + +<pre class="brush: js">function Init () { + var myTextbox = document.getElementById('my-textbox'); + myTextbox.addEventListener( 'keypress', checkName, false ); +} + +function checkName(evt) { + var charCode = evt.charCode; + if (charCode != 0) { + if (charCode < 97 || charCode > 122) { + evt.preventDefault(); + alert( + "Please use lowercase letters only." + + "\n" + "charCode: " + charCode + "\n" + ); + } + } +} +</pre> + +<pre class="brush: html"></script> +</head> +<body onload="Init ()"> + <p>Please enter your name using lowercase letters only.</p> + <form> + <input type="text" id="my-textbox" /> + </form> +</body> +</html></pre> +</div> + +<p>Aqui está o resultado do código anterior:</p> + +<p>{{ EmbedLiveSample('preventDefault_invalid_text', '', '', '') }}</p> + +<h2 id="Notes" name="Notes">Notas</h2> + +<p>Chamar preventDefault durante qualquer fase do fluxo de eventos cancela o evento, o que significa que qualquer ação padrão normalmente feita pela aplicação como um resultado do evento não ocorrerá.</p> + +<div class="note"> +<p><strong>Nota:</strong> A partir do {{Gecko("6.0")}}, chamar o <code>preventDefault()</code> faz com que o {{ domxref("event.defaultPrevented") }} se torne true.</p> +</div> + +<p>Você pode usar o <a href="/en-US/docs/Web/API/event.cancelable" title="/en-US/docs/Web/API/event.cancelable">event.cancelable</a> para checar se o evento é cancelável. Chamar o <code>preventDefault</code> para um evento não cancelável não fará efeito.</p> + +<p><code>Se o preventDefault não parar a propagação do evento através do DOM. event.stopPropagation deve ser usada para isso.</code></p> + +<h2 id="Specification" name="Specification">Especificação</h2> + +<ul> + <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-Event-preventDefault">DOM Level 2 Events: preventDefault</a></li> +</ul> diff --git a/files/pt-br/web/api/event/srcelement/index.html b/files/pt-br/web/api/event/srcelement/index.html new file mode 100644 index 0000000000..c66dc744d4 --- /dev/null +++ b/files/pt-br/web/api/event/srcelement/index.html @@ -0,0 +1,74 @@ +--- +title: Event.srcElement +slug: Web/API/Event/srcElement +translation_of: Web/API/Event/srcElement +--- +<p>{{ApiRef("DOM")}}</p> + +<p>{{ Non-standard_header() }}</p> + +<p><strong><code>Event.srcElement</code></strong> é uma propriedade <em>alias</em> para a propriedade padrão {{domxref("Event.target")}}. É específica para versões antigas do Microsoft Internet Explorer.</p> + +<h2 id="Especificações">Especificações</h2> + +<p>Não é parte de nenhuma especificação.</p> + +<p>Microsoft <a href="https://msdn.microsoft.com/en-us/library/ff974945(v=vs.85).aspx">tem uma descrição na MSDN</a>.</p> + +<h2 id="Compatibilidade_de_navegadores">Compatibilidade de navegadores</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</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>{{CompatNo}} [1]</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</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>{{CompatUnknown}}</td> + <td>{{CompatNo}} [1]</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1]: {{bug(453968)}}</p> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li>{{domxref("Window.event")}}</li> +</ul> diff --git a/files/pt-br/web/api/event/stopimmediatepropagation/index.html b/files/pt-br/web/api/event/stopimmediatepropagation/index.html new file mode 100644 index 0000000000..a5de39c083 --- /dev/null +++ b/files/pt-br/web/api/event/stopimmediatepropagation/index.html @@ -0,0 +1,99 @@ +--- +title: Event.stopImmediatePropagation() +slug: Web/API/Event/stopImmediatePropagation +tags: + - API + - Method + - Referência(2) + - event.stopImmediatePropagation(); + - events + - pt-br + - stopImmediatePropagation +translation_of: Web/API/Event/stopImmediatePropagation +--- +<div>{{APIRef("DOM")}}</div> + +<p>Evita que outros <em>listeners</em> escutem o evento.</p> + +<h2 id="Sintaxe">Sintaxe</h2> + +<pre class="eval"><em>event</em>.stopImmediatePropagation(); +</pre> + +<h2 id="Notas">Notas</h2> + +<p>No caso de um evento onde vários <em>listeners </em>o estão escutando, os mesmos são disparados na ordem em que foram adicionados. Porém, se durante uma chamada (ou disparo), <code>event.stopImmediatePropagation()</code> for chamado, os demais <em>listeners</em> não serão disparados.</p> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Status</th> + <th scope="col">Comentários</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('DOM WHATWG', '#dom-event-stopimmediatepropagation', 'Event.stopImmediatePropagation()')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('DOM4', '#dom-event-stopimmediatepropagation', 'Event.stopImmediatePropagation()')}}</td> + <td>{{Spec2('DOM4')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade">Compatibilidade</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>{{CompatChrome("6.0")}}</td> + <td>{{CompatGeckoDesktop("10.0")}}</td> + <td>{{CompatIE(9.0)}}</td> + <td>{{CompatOpera("15.0")}}</td> + <td>{{CompatSafari("5.0")}}</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>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/pt-br/web/api/event/stoppropagation/index.html b/files/pt-br/web/api/event/stoppropagation/index.html new file mode 100644 index 0000000000..54d0c9bd5f --- /dev/null +++ b/files/pt-br/web/api/event/stoppropagation/index.html @@ -0,0 +1,93 @@ +--- +title: Event.stopPropagation() +slug: Web/API/Event/stopPropagation +tags: + - API + - Evento + - Referencia + - Referência(2) + - metodo + - stopPropagation +translation_of: Web/API/Event/stopPropagation +--- +<p id="Summary">{{APIRef("DOM")}}</p> + +<h2 id="Summary" name="Summary">Resumo</h2> + +<p>Impede a propagação do evento por seus respectivos listeners.</p> + +<h2 id="Syntax" name="Syntax">Sintaxe</h2> + +<pre class="syntaxbox notranslate"><em>event</em>.stopPropagation();</pre> + +<h3 id="Parametros">Parametros</h3> + +<p>Nenhum</p> + +<h3 id="Valor_retornado">Valor retornado</h3> + +<p><code>undefined</code>.</p> + +<h2 id="Example" name="Example">Exemplo</h2> + +<p>Veja o exemplo 5: <a href="https://developer.mozilla.org/en-US/docs/DOM/DOM_Reference/Examples#Example_5:_Event_Propagation" title="Gecko_DOM_Reference/Examples#Example_5:_Event_Propagation">Event Propagation</a> no capítulo Eventos para um exemplo mais detalhado desse método e propagação de evento no DOM.</p> + +<h2 id="Notes" name="Notes">Notas</h2> + +<p>Veja <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-capture">DOM specification</a> para a explicação do fluxo de eventos. (O <a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow" title="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow">DOM Level 3 Events draft</a> possui uma ilustração.)</p> + +<p><a href="/en-US/docs/Web/API/event.preventDefault" title="/docs/Web/API/event.stopPropagation">preventDefault</a> é um método de complemento que pode ser usado para previnir a ação padrão do evento que estiver acontecendo.</p> + +<h2 id="Specification" name="Specification">Especificação</h2> + +<p><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#events-event-type-stopPropagation">DOM Level 3 Events: stopPropagation</a></p> + +<h2 id="Compatibilidade_do_Browser">Compatibilidade do Browser</h2> + +<p>{{CompatibilityTable()}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Recurso</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>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>9</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Recurso</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>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/pt-br/web/api/event/target/index.html b/files/pt-br/web/api/event/target/index.html new file mode 100644 index 0000000000..8a3ab35191 --- /dev/null +++ b/files/pt-br/web/api/event/target/index.html @@ -0,0 +1,69 @@ +--- +title: Event.target +slug: Web/API/Event/target +tags: + - PortuguêsBrasil + - pt-br +translation_of: Web/API/Event/target +--- +<div>{{ApiRef("DOM")}}</div> + +<p>Uma referência ao objeto que enviou o evento. É diferente de {{domxref ("event.currentTarget")}} quando o manipulador de eventos é chamado durante a fase de borbulhagem ou captura do evento.</p> + +<h2 id="Sintaxe">Sintaxe</h2> + +<pre class="syntaxbox notranslate">theTarget = event.target</pre> + +<h2 id="Exemplo">Exemplo</h2> + +<p>A propriedade <strong><code>event.target</code></strong> pode ser usada para implementar a delegação de eventos.</p> + +<pre class="brush: js notranslate">// Assumindo que existe uma variável 'list' contendo uma instância de um elemento ul de HTML. +function hide(e) { + // A menos que os itens da lista sejam separados por uma margem, <em>e.target</em> deve ser diferente de <em>e.currentTarget</em> + e.target.style.visibility = 'hidden'; +} + +list.addEventListener('click', hide, false); + +// Se algum elemento (elemento <li> ou um link dentro de um elemento <li> por exemplo) for clicado, ele desaparecerá. +// Só requer um único listener para fazer isso. +</pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>Specification</th> + <th>Status</th> + <th>Comment</th> + </tr> + <tr> + <td>{{SpecName("DOM WHATWG", "#dom-event-target", "Event.target")}}</td> + <td>{{Spec2("DOM WHATWG")}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName("DOM4", "#dom-event-target", "Event.target")}}</td> + <td>{{Spec2("DOM4")}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName("DOM2 Events", "#Events-Event-target", "Event.target")}}</td> + <td>{{Spec2("DOM2 Events")}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_do_navegador">Compatibilidade do navegador</h2> + + +<p>{{Compat("api.Event.target")}}</p> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Event/Comparison_of_Event_Targets">Comparison of Event Targets</a></li> +</ul> diff --git a/files/pt-br/web/api/event/type/index.html b/files/pt-br/web/api/event/type/index.html new file mode 100644 index 0000000000..3ca34e79f3 --- /dev/null +++ b/files/pt-br/web/api/event/type/index.html @@ -0,0 +1,60 @@ +--- +title: Event.type +slug: Web/API/Event/type +translation_of: Web/API/Event/type +--- +<p id="Summary">{{APIRef("DOM")}}</p> + +<h2 id="Summary" name="Summary">Sumário</h2> + +<p>Retorna uma string contendo o tipo de evento.</p> + +<p>O argumento do evento {{ domxref("EventTarget.addEventListener()") }} e {{ domxref("EventTarget.removeEventListener()") }} é caso insensível(case insensitive).</p> + +<p>Veja <a href="/en-US/docs/Mozilla_event_reference" title="Mozilla event reference">Mozilla event reference</a> para obter a lista de tipos de evento disponíveis</p> + +<h2 id="Syntax" name="Syntax">Sintaxe</h2> + +<pre class="syntaxbox">event.type +</pre> + +<h2 id="Example" name="Example">Exemplos</h2> + +<pre><code><em>var string</em> = event.type;</code> +</pre> + +<pre class="brush: html"><!DOCTYPE html> +<html lang="pt-br"> +<head> + +<title>exemplo de tipo</title> + +<script> +var currEvent = null; + +function getEvtType(evt) { + currEvent = evt.type; + document.getElementById("Etype").firstChild.nodeValue = currEvent; +} + +</script> +</head> + +<body + onkeydown="getEvtType(event)" + onkeyup="getEvtType(event)" + onmousedown="getEvtType(event)" + onmouseup="getEvtType(event)"> + +<p>Pressione uma tecla ou clique com o mouse para obter o tipo de evento.</p> +<p>Tipo de evento: <span id="Etype">-</span></p> + +</body> +</html> +</pre> + +<h2 id="Specification" name="Specification">Especificação</h2> + +<ul> + <li><a class="external" href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-Event-type">type </a></li> +</ul> |