W3Cschool
恭喜您成為首批注冊用戶
獲得88經(jīng)驗值獎勵
當元素獲得焦點時,focus事件將觸發(fā)。這個事件和focusin之間的主要區(qū)別在于只有后者冒泡。
注意:與focus相反的是blur。
接口 | FocusEvent |
---|---|
同步/異步 | 同步 |
是否冒泡 | 沒有 |
是否可取消 | 沒有 |
目標 | Window , Element |
是否組合 | 是 |
默認操作 | 沒有 |
屬性 | 類型 | 描述 |
---|---|---|
target (只讀) | EventTarget | 事件目標(DOM元素) |
type (只讀) | DOMString | 事件的類型。 |
bubbles (只讀) | Boolean | 事件是否正常冒泡。 |
cancelable (只讀) | Boolean | 事件是否可以取消。 |
relatedTarget (只讀) | EventTarget (DOM元素) | null |
有兩種方法可以為此事件實現(xiàn)事件授權:通過使用focusin事件或將addEventListener()的useCapture參數(shù)設置為true。
請參閱blur參考頁面上此示例的代碼。
此示例在失去焦點時更改文檔的外觀。它使用addEventListener()來監(jiān)視focus和blur事件。
<p id="log">Click on this document to give it focus.</p>
.paused {
background: #ddd;
color: #555;
}
function pause() {
document.body.classList.add('paused');
log.textContent = 'FOCUS LOST!';
}
function play() {
document.body.classList.remove('paused');
log.textContent = 'This document has focus.';
}
const log = document.getElementById('log');
window.addEventListener('blur', pause);
window.addEventListener('focus', play);
規(guī)范 | 狀態(tài) | 注釋 |
---|---|---|
UI事件 | Working Draft | 添加了此事件的組成信息 |
文檔對象模型(DOM)3級事件規(guī)范 | Obsolete | 初步定義 |
我們將兼容性數(shù)據(jù)轉換為機器可讀的JSON格式。
Chrome | Edge | Firefox(Gecko) | Internet Explorer | Opera | Safari | |
---|---|---|---|---|---|---|
基本支持 | 支持 | 支持 | 支持 | 支持 | 支持 | 支持 |
特征 | Android | 適用于Android的Chrome | Edge | Firefox Mobile(Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|
基本支持 | ? | ?支持 | ? | ? | ? | ? |
在Firefox 24之前該接口是Event。
Copyright©2021 w3cschool編程獅|閩ICP備15016281號-3|閩公網(wǎng)安備35020302033924號
違法和不良信息舉報電話:173-0602-2364|舉報郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號
聯(lián)系方式:
更多建議: