diff options
Diffstat (limited to 'files/de/web/api/windoweventhandlers')
4 files changed, 501 insertions, 0 deletions
diff --git a/files/de/web/api/windoweventhandlers/index.html b/files/de/web/api/windoweventhandlers/index.html new file mode 100644 index 0000000000..cdd4a8258b --- /dev/null +++ b/files/de/web/api/windoweventhandlers/index.html @@ -0,0 +1,189 @@ +--- +title: WindowEventHandlers +slug: Web/API/WindowEventHandlers +tags: + - API + - HTML-DOM + - Interface + - NeedsTranslation + - Reference + - TopicStub +translation_of: Web/API/WindowEventHandlers +--- +<div>{{APIRef("HTML DOM")}}</div> + +<p><strong><code>WindowEventHandlers</code></strong> describes the event handlers common to several interfaces like {{domxref("Window")}}, or {{domxref("HTMLBodyElement")}} and {{domxref("HTMLFrameSetElement")}}. Each of these interfaces can implement more event handlers.</p> + +<p><code>WindowEventHandlers</code> is a not an interface and no object of this type can be created.</p> + +<h2 id="Properties">Properties</h2> + +<p><em>The events properties, of the form <code>onXYZ</code>, are defined on the {{domxref("WindowEventHandlers")}}, and implemented by {{domxref("Window")}}, and {{domxref("WorkerGlobalScope")}} for Web Workers.</em></p> + +<dl> + <dt>{{domxref("WindowEventHandlers.onafterprint")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("afterprint")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onbeforeprint")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("beforeprint")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onbeforeunload")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("beforeunload")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onhashchange")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("hashchange")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onlanguagechange")}} {{experimental_inline}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("languagechange")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onmessage")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("message")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onoffline")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("offline")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.ononline")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("online")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onpagehide")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pagehide")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onpageshow")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pageshow")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onpopstate")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("popstate")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onresize")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("resize")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onstorage")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("storage")}} event is raised.</dd> + <dt>{{domxref("WindowEventHandlers.onunload")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("unload")}} event is raised.</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<p><em>This interface defines no method.</em></p> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', '#windoweventhandlers', 'GlobalEventHandlers')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', '#windoweventhandlers', 'GlobalEventHandlers')}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot of {{SpecName("HTML WHATWG")}}. Added <code>onlanguage</code> since the {{SpecName("HTML 5")}} snapshot.</td> + </tr> + <tr> + <td>{{SpecName("HTML5 W3C", "#windoweventhandlers", "GlobalEventHandlers")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowEventHandlers</code> (properties where on the target before it).</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</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>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>onhashchange</code></td> + <td>{{CompatGeckoDesktop(1.9.2)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>onlanguage</code>{{experimental_inline}}</td> + <td>{{CompatGeckoDesktop(32)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>onstorage</code></td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</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>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>onhashchange</code></td> + <td>{{CompatGeckoMobile(1.9.2)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>onlanguage</code>{{experimental_inline}}</td> + <td>{{CompatGeckoMobile(32)}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>onstorage</code></td> + <td>{{CompatNo}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + <td rowspan="1">{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{domxref("Window")}} and {{domxref("WorkerGlobalScope")}}</li> +</ul> diff --git a/files/de/web/api/windoweventhandlers/onafterprint/index.html b/files/de/web/api/windoweventhandlers/onafterprint/index.html new file mode 100644 index 0000000000..088f6c91aa --- /dev/null +++ b/files/de/web/api/windoweventhandlers/onafterprint/index.html @@ -0,0 +1,93 @@ +--- +title: WindowEventHandlers.onafterprint +slug: Web/API/WindowEventHandlers/onafterprint +translation_of: Web/API/WindowEventHandlers/onafterprint +--- +<div>{{ApiRef}}</div> + +<div>Die Eigenschaft WindowEventHandlers.onafterprint definiert und gibt den {{event("onafterprint")}} {{domxref("EventHandler")}} für das aktuelle Window aus.</div> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox"><em>window</em>.onafterprint = <em>event handling code</em> +</pre> + +<h2 id="Beschreibung">Beschreibung</h2> + +<p>Manche Browser (inklusive Firefox 6 und neuer, Internet Explorer) senden <code>beforeprint </code>und <code>afterprint</code> Events um zu bestimmen, ob ein Druckvorgang stattgefunden hat. Diese Funktion kann genutzt werden um das User-Interface während des Druckvorgangs anzupassen (z.B das Ausblenden von User-Interface Elementen während des Druckvorgangs).</p> + +<p>Das <code>afterprint E</code>vent wird ausgelöst nachdem der Nutzer gedruckt hat oder den den Druck abgebrochen hat.</p> + +<h2 id="Spezifikation">Spezifikation</h2> + +<p>Nicht Teil einer Spezifikation.</p> + +<h2 id="Browserkompatbilität">Browserkompatbilität</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>Basic support</td> + <td>{{CompatNo}}</td> + <td>6.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Siehe_auch">Siehe auch</h2> + +<ul> + <li>{{domxref("window.print")}}</li> + <li>{{domxref("window.onbeforeprint")}}</li> + <li><a href="/en-US/docs/">Drucken</a></li> + <li>In Webkitbrowsern kann eine equivalentes Ergebnis mit <code>matchMedia('print')</code> erreicht werden.</li> + <li> + <pre><code>var mediaQueryList = window.matchMedia('print'); +mediaQueryList.addListener(function(mql) { +<span class="Apple-tab-span" style="white-space: pre;"> </span>if (!mql.matches) { +<span class="Apple-tab-span" style="white-space: pre;"> </span>console.log('onafterprint'); +<span class="Apple-tab-span" style="white-space: pre;"> </span>}; +});</code> +</pre> + </li> +</ul> + +<div class="grammarly-disable-indicator"> </div> diff --git a/files/de/web/api/windoweventhandlers/onhashchange/index.html b/files/de/web/api/windoweventhandlers/onhashchange/index.html new file mode 100644 index 0000000000..3bb0fb12a9 --- /dev/null +++ b/files/de/web/api/windoweventhandlers/onhashchange/index.html @@ -0,0 +1,162 @@ +--- +title: WindowEventHandlers.onhashchange +slug: Web/API/WindowEventHandlers/onhashchange +tags: + - Eigenschaft + - Event + - HTML-DOM + - Referenz + - WindowEventHandlers +translation_of: Web/API/WindowEventHandlers/onhashchange +--- +<div> +<div>{{APIRef("HTML DOM")}}</div> +</div> + +<p>Das <strong>hashchange</strong> Event wird ausgelöst wenn sich der window.hash verändert (siehe {{domxref("Window.location", "location.hash")}}).</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">window.onhashchange = funcRef; +</pre> + +<p><strong>oder</strong></p> + +<pre class="syntaxbox"><body onhashchange="funcRef();"> +</pre> + +<p><strong>oder</strong></p> + +<pre class="syntaxbox">window.addEventListener("hashchange", funcRef, false); +</pre> + +<h3 id="Parameter">Parameter</h3> + +<dl> + <dt><code>funcRef</code></dt> + <dd>Ein Verweis auf eine Funktion.</dd> +</dl> + +<h2 id="Beispiel">Beispiel</h2> + +<pre class="brush:js">if ("onhashchange" in window) { + alert("Der Browser unterstützt das hashchange-Event!"); +} + +function locationHashChanged() { + if (location.hash === "#irgendeinCoolesFeature") { + featureFunction(); + } +} + +window.onhashchange = locationHashChanged; +</pre> + +<h2 id="Das_hashchange_Event">Das hashchange Event</h2> + +<p>Das ausgelöste <code>hashchange</code> Event hat folgende Eigenschaften:</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">Eigenschaft</td> + <td class="header">Typ</td> + <td class="header">Beschreibung</td> + </tr> + <tr> + <td><code>newURL</code> {{gecko_minversion_inline("6.0")}}</td> + <td><code>DOMString</code></td> + <td>Die neue URL zu der das Fenster nun navigiert.</td> + </tr> + <tr> + <td><code>oldURL</code> {{gecko_minversion_inline("6.0")}}</td> + <td><code>DOMString</code></td> + <td>Die vorherige URL, von der aus das Fenster navigierte.</td> + </tr> + </tbody> +</table> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', '#windoweventhandlers', 'GlobalEventHandlers')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', '#windoweventhandlers', 'GlobalEventHandlers')}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("HTML5 W3C", "#windoweventhandlers", "GlobalEventHandlers")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browser-Kompatiblität</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>Basic support</td> + <td>5.0</td> + <td>{{CompatGeckoDesktop("1.9.2")}}</td> + <td> + <p>8.0</p> + + <p><code style="font-size: 14px;">oldURL</code>/<code style="font-size: 14px;">newURL</code> Eigenschaften werden nicht unterstützt.</p> + </td> + <td>10.6</td> + <td>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>Basic support</td> + <td>2.2</td> + <td>{{CompatGeckoMobile("1.9.2")}}</td> + <td>9.0</td> + <td>11.0</td> + <td>5.0</td> + </tr> + </tbody> +</table> +</div> + +<ul> + <li><a href="/en-US/docs/DOM/Manipulating_the_browser_history" title="DOM/Manipulating the browser history">Browserverlauf manipulieren</a>, <a href="/en-US/docs/DOM/window.history" title="DOM/window.history">history.pushState() und history.replaceState()</a>-Methoden, <a href="/en-US/docs/DOM/window.onpopstate" title="DOM/window.onpopstate">popstate</a>-Event.</li> +</ul> diff --git a/files/de/web/api/windoweventhandlers/onpopstate/index.html b/files/de/web/api/windoweventhandlers/onpopstate/index.html new file mode 100644 index 0000000000..5154919751 --- /dev/null +++ b/files/de/web/api/windoweventhandlers/onpopstate/index.html @@ -0,0 +1,57 @@ +--- +title: WindowEventHandlers.onpopstate +slug: Web/API/WindowEventHandlers/onpopstate +translation_of: Web/API/WindowEventHandlers/onpopstate +--- +<div>{{APIRef}} {{gecko_minversion_header("2")}}</div> + +<h2 id="Summary" name="Summary">Zusammenfassung</h2> + +<p>Hier geht es um die Ereignisbehandlungsroutine, üblicherweise <em>event handler </em>genannt, für das <code>popstate</code> Ereignis (<em>event</em>) des <code>window</code> Objekts.</p> + +<p>Ein <code>popstate</code> Ereignis wird an <code>window</code> übermittelt, wann immer der aktive <code>history</code> Eintrag zwischen zwei Einträgen für dasselbe Dokument wechselt. Falls der zu aktivierende history Eintrag erzeugt wurde durch den Aufruf von <code>history.pushState()</code> oder beeinflusst wurde durch Aufruf von <code>history.replaceState(), </code>dann enthält die <code>state</code> Eigenschaft des <code>popstate</code> Ereignisses eine Kopie des <code>state</code> Objekts des <code>history</code> Eintrags.<code> </code></p> + +<p>Es gilt zu beachten, dass der bloße Aufruf von <code>history.pushState()</code> oder <code>history.replaceState()</code> kein <code>popstate</code> Ereignis auslöst. Das <code>popstate</code> Ereignis wird allein durch Anklicken des Zurück-Buttons (oder den Aufruf von <code>history.back()</code> per Javascript) ausgelöst. Auch wird das Ereignis nur ausgelöst, wenn sich der Anwender zwischen zwei <code>history </code>Einträgen für dasselbe Dokument bewegt.</p> + +<p>Browser behandeln den <code>popstate</code> Zustand nach initialem Laden einer Seite (<code>onload</code>) auf verschiedene Weise. Chrome (vor Version 34) und Safari senden immer ein <code>popstate</code> Ereignis, Firefox hingegen nicht.</p> + +<h2 id="Syntax" name="Syntax">Syntax</h2> + +<pre class="syntaxbox">window.onpopstate = <var>funcRef</var>; +</pre> + +<ul> + <li><var>funcRef</var> ist eine <em>event</em> <em>handler</em> Funktion, bzw. Ereignisbehandlungsroutine.</li> +</ul> + +<h2 id="The_popstate_event" name="The_popstate_event">Das popstate Ereignis</h2> + +<p>Zum Beispiel würde eine Seite mit der URL <code><var>http://example.com/example.html</var></code> beim Durchlaufen dieses Codes die folgenden Meldungen in der Konsole ausgeben:</p> + +<pre class="brush:js">window.onpopstate = function(event) { + alert("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(); // alerts "location: http://example.com/example.html?page=1, state: {"page":1}" +history.back(); // alerts "location: http://example.com/example.html, state: null +history.go(2); // alerts "location: http://example.com/example.html?page=3, state: {"page":3} +</pre> + +<p>Obwohl mit dem ursprünglichen <code>history</code> Eintrag (für die URL <code><var>http://example.com/example.html</var></code>) kein <code>state</code> Objekt verknüpft ist, wird dennoch ein <code>popstate</code> Ereignis ausgelöst, sobald dieser Eintrag durch den zweiten Aufruf von <code>history.back()</code> aktiv wird.</p> + +<h2 id="Specification" name="Specification">Spezifikation</h2> + +<ul> + <li><a href="http://www.whatwg.org/specs/web-apps/current-work/#handler-window-onpopstate">HTML5 popstate event</a></li> +</ul> + +<h2 id="See_also" name="See_also">Weiterführende Informationen</h2> + +<ul> + <li>{{domxref("window.history")}}</li> + <li><a href="/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history">Manipulating the browser history</a></li> + <li><a href="/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history/Example">Ajax navigation example</a></li> +</ul> |