1. 程式人生 > >捕獲移動端鍵盤Enter事件

捕獲移動端鍵盤Enter事件

最近做了一個需求,其中有個細節是能搜尋,點選鍵盤上的Enter時能進行搜尋,這就需要捕獲鍵盤上的Enter事件了。

 

其實鍵盤上的每個鍵都有一個鍵盤碼,我們能獲取其鍵盤碼從而判斷事件。

按鍵 鍵碼
ESC鍵 VK_ESCAPE (27)
回車鍵 VK_RETURN (13)
TAB鍵 VK_TAB (9)
Caps Lock鍵 VK_CAPITAL (20)
Shift鍵 VK_SHIFT ($10)
Ctrl鍵 VK_CONTROL (17)
Alt鍵 VK_MENU (18)
空格鍵 VK_SPACE ($20/32)
退格鍵 VK_BACK (8)
左徽標鍵 VK_LWIN (91)
右徽標鍵 VK_LWIN (92)
滑鼠右鍵快捷鍵 VK_APPS (93)

而我這次要用到的僅僅是Enter鍵程式碼如下:

<input 
    type="search" 
    placeholder="搜尋課程…" 
    value={self.state.query}
    onChange={self.handleSearchChange}
    onKeyUp={self.handleKeyUp}
    onBlur={Util.scrollPage}
></input>
/**
 * @msg: 監聽按下搜尋鍵
 * @param {type} 
 * @return: 
 */
handleKeyUp = (e) => {
    // 監控 enter 事件
    if (e.keyCode === 13) {
        this.setState({
            pageNum: 1,
        });
        this.getData();
    }
}