Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.cdn.mozilla.net/en-US/docs/Web/API/InputEvent/inputType below:

InputEvent: inputType property - Web APIs

Baseline Widely available *

The inputType read-only property of the InputEvent interface returns the type of change made to editable content. Possible changes include for example inserting, deleting, and formatting text.

A string containing the type of input that was made. There are many possible values, such as insertText, deleteContentBackward, insertFromPaste, and formatBold. For a complete list of the available input types, see the Attributes section of the Input Events Level 2 spec.

This example logs the inputType for input events on an editable <div>.

<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>

.sample-text {
  margin: 20px;
  padding: 20px;
  border: 2px dashed red;
}

const log = document.getElementById("log");
const editable = document.querySelector("div[contenteditable]");
editable.addEventListener("input", logInputType);

function logInputType(event) {
  log.textContent = `Input type: ${event.inputType}`;
}

Try editing the text inside the <div> and see what happens.

Note: See also Masayuki Nakano's InputEvent test suite for a more detailed example.

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4