GlobalEventHandlers.oninput

GlobalEventHandlersmixin的oninput属性是event handler,它处理<input><select>和 <textarea> 元素上的 input (en-US) 事件。 它还会在contenteditable 或 designMode打开的元素上处理这些事件。

注意:与oninput不同的是, onchange 事件处理程序不一定会针对元素值的每次更改而调用。

语法

target.oninput = functionRef;

functionRef是一个函数名或函数表达式。该函数接收InputEvent 对象作为唯一参数。

示例

HTML

<input type="text" placeholder="Type something here to see its length."size="50"> <p id="log"></p>

JavaScript

let input = document.querySelector('input');
let log =document.getElementById('log');
input.oninput = handleInput;
function handleInput(e) {
  log.textContent = `The field's value is${e.target.value.length} character(s) long.`;
}

结果

规范

Specification Status Comment
HTML Living Standard
oninput
Living Standard Initial definition

浏览器兼容性

BCD tables only load in the browser

The following links discuss compatibility issues and fixes that may be helpful when working with older browsers:

参见