InputEvent: Eigenschaft inputType
Baseline
Weitgehend verfügbar
*
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Januar 2020 browserübergreifend verfügbar.
* Einige Teile dieser Funktion werden möglicherweise unterschiedlich gut unterstützt.
Die schreibgeschützte Eigenschaft inputType des InputEvent-Interfaces gibt den Typ der Änderung zurück, die an bearbeitbarem Inhalt vorgenommen wurde. Mögliche Änderungen umfassen beispielsweise das Einfügen, Löschen und Formatieren von Text.
Wert
Ein String, der den Typ der vorgenommenen Eingabe enthält. Es gibt viele mögliche Werte, wie insertText, deleteContentBackward, insertFromPaste und formatBold. Für eine vollständige Liste der verfügbaren Eingabetypen siehe den Abschnitt "Attributes" der Input Events Level 2 Spezifikation.
Beispiele
Dieses Beispiel protokolliert den inputType für input events auf einem bearbeitbaren <div>.
HTML
<p id="log">Input type:</p>
<div contenteditable="true" class="sample-text">
<p>
Some sample text. Try inserting line breaks, or deleting text in different
ways, or pasting different content in.
</p>
<hr />
<ul>
<li>A sample</li>
<li>bulleted</li>
<li>list.</li>
</ul>
<p>Another paragraph.</p>
</div>
CSS
.sample-text {
margin: 20px;
padding: 20px;
border: 2px dashed red;
}
JavaScript
const log = document.getElementById("log");
const editable = document.querySelector("div[contenteditable]");
editable.addEventListener("input", logInputType);
function logInputType(event) {
log.textContent = `Input type: ${event.inputType}`;
}
Ergebnis
Versuchen Sie, den Text im <div> zu bearbeiten und sehen Sie, was passiert.
Hinweis: Siehe auch Masayuki Nakanos InputEvent-Test-Suite für ein detaillierteres Beispiel.
Spezifikationen
| Spezifikation |
|---|
| UI Events # dom-inputevent-inputtype |