Zdarzenia#
Typ compositionend#
| Typ: | compositionend |
|---|---|
| Interfejs: | CompositionEvent |
| Sync / Async: | Sync |
| Bąbelkowanie | Tak |
| Zaufane cele | Element |
| Anulowanie | Nie |
| Domyślna akcja | Brak |
| Kontekst (zaufane zdarzenia) |
|
Zdarzenie typu compositionend musi zostać wysłane przez aplikację kliencką w chwili, kiedy system kompozycji tekstu skompletował lub anulował aktualną sesję kompozycji, a także po aktualizacji kontroli.
Zdarzenie typu compositionend musi zostać wysłane bezpośrednio po zakończeniu przez system kompozycji tekstu bieżącej sesji kompozycji (np. po zamknięciu lub zminimalizowaniu narzędzia IME, przeniesieniu zogniskowania, lub oddalenia w inny sposób i powrotnego ustawienia zogniskowania do aplikacji klienckiej).
Prosty przykład:
<!DOCTYPE html>
<html>
<head>
<style>
input {vertical-align: top;}
input:hover, #box:hover {outline: 3px solid green;}
#box {width: 200px; height: 100px; display: inline-block; background-color: #a08080;}
</style>
</head>
<body>
<p>Edytuj zawartość poniższych elementów przy użyciu IME by odczytać poszczególne cechy zdarzenia.</p>
<div id="box" contenteditable="true">Edytowalny kontener</div>
<input size="40" type="text" value="Jakiś początkowy tekst">
<p style="color: blue;">Szczegółowe informacje dla przechwyconego zdarzenia:</p>
<p id="info"></p>
<script>
var box = document.getElementById("box");
var input = document.getElementsByTagName("input")[0];
var info = document.getElementById("info");
function readInfo(e){
var data = "Interfejs: " + e
+ "<br>" + "e.type: " + e.type
+ "<br>" + "e.target: " + e.target
+ "<br>" + "e.view: " + e.view
+ "<br>" + "e.detail: " + e.detail
+ "<br>" + "e.type: " + e.type
+ "<br>" + "e.data: " + e.data
+ "<br>" + "e.locale: " + e.locale
+ "<br>" + "e.currentTarget: " + e.currentTarget
+ "<br>" + "e.eventPhase: " + e.eventPhase + "<br><br>";
info.innerHTML = info.innerHTML + data;
}
box.addEventListener("compositionstart", readInfo, false);
box.addEventListener("compositionupdate", readInfo, false);
box.addEventListener("compositionend", readInfo, false);
input.addEventListener("compositionstart", readInfo, false);
input.addEventListener("compositionupdate", readInfo, false);
input.addEventListener("compositionend", readInfo, false);
</script>
</body>
</html>Specyfikacje i inne materiały#
Pasek społecznościowy