InputEvent.data - Web API 接口参考 编辑
这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。
请注意,data
属性在使用键盘输入时会返回输入的字符内容,但在粘贴、拖动时可能会返回 null
,这取决于浏览器。浏览器也可能把一些数据保存在 InputEvent.dataTransfer
,而不是该 data
属性中。
InputEvent
接口中的只读属性 data
返回含有插入字符数据的 DOMString
。如果更改未插入文本(例如删除字符时),则其可能为空字符串。
语法
var string = inputEvent.data;
返回值
一个 DOMString
。
示例
在下面的简单示例中,我们在 input 事件上设置了一个事件监听器,以便在对 <input>
元素的内容进行任何更改时(通过键入或粘贴),通过 InputEvent.data
属性检索添加的文本,并在 <input>
下面的段落中报告。
<p>Some text to copy and paste.</p>
<input type="text">
<p class="result"></p>
var editable = document.querySelector('input')
var result = document.querySelector('.result');
editable.addEventListener('input', (e) => {
result.textContent = "Inputted text: " + e.data;
});
规范
Specification | Status | Comment |
---|---|---|
Input Events Level 2 data | Working Draft | Initial definition. |
浏览器兼容性
BCD tables only load in the browser
此页上的兼容性表是从结构化数据生成的。如果您想贡献数据,请访问 https://github.com/mdn/browser-compat-data 并向我们发送一个请求。如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论