GlobalEventHandlers.onkeypress

在此页

句法
范例
规范
浏览器兼容性
另请参阅
相关话题

弃用
This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the 兼容性表格 at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

onkeypress 特性为 GlobalEventHandlers 混合 EventHandler 处理 keypress 事件。

keypress event should fire when the user presses a key on the keyboard. However, in practice browsers do not fire keypress events for certain keys.

onkeypress event handler has been deprecated. You may want to use onkeydown 代替。

句法

target.onkeypress = functionRef;

值

functionRef is a function name or a 函数表达式 . The function receives a KeyboardEvent object as its sole argument.

范例

基本范例

This example logs the KeyboardEvent.code value whenever you press a key inside the <input> 元素。

HTML

<input>
<p id="log"></p>

JavaScript

const input = document.querySelector('input');
const log = document.getElementById('log');
input.onkeypress = logKey;
function logKey(e) {
  log.textContent += ` ${e.code}`;
}

结果

Filter keys with a regular expression

This example filters the characters typed into a form field using a regular expression .

HTML

<label>Enter numbers only:
  <input>
</label>

JavaScript

function numbersOnly(event) {
  return event.charCode === 0 || /\d/.test(String.fromCharCode(event.charCode));
}
const input = document.querySelector('input');
input.onkeypress = numbersOnly;
// Prevent pasting (since pasted content might include non-number characters)
input.onpaste = event => false;

结果

Capture the typing of a hidden word

The following JavaScript function will do something after the user types the word "exit" in any point of a page.

/* Type the word "exit" in any point of your page... */
(function () {
  const sSecret = /* Choose your hidden word...: */ "exit";
  let nOffset = 0;
  document.onkeypress = function(oPEvt) {
    let oEvent = oPEvt || window.event,
        nChr = oEvent.charCode,
        sNodeType = oEvent.target.nodeName.toUpperCase();
    if (nChr === 0 ||
        oEvent.target.contentEditable.toUpperCase() === "TRUE" ||
        sNodeType === "TEXTAREA" ||
        sNodeType === "INPUT" && oEvent.target.type.toUpperCase() === "TEXT") {
      return true;
    }
    if (nChr !== sSecret.charCodeAt(nOffset)) {
      nOffset = nChr === sSecret.charCodeAt(0) ? 1 : 0;
    } else if (nOffset < sSecret.length - 1) {
      nOffset++;
    } else {
      nOffset = 0;
      /* Do something here... */
      alert("Yesss!!!");
      location.assign("https://developer.mozilla.org/");
    }
    return true;
  };
})();

注意： A more complete framework for capturing the typing of hidden words is available on GitHub .

规范

规范	状态	注释
HTML 实时标准 The definition of 'onkeypress' in that specification.	实时标准

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`onkeypress`	Chrome Yes	Edge ≤18	Firefox Yes	IE ?	Opera ?	Safari ?	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android ?	Safari iOS ?	Samsung Internet Android Yes

图例

完整支持
兼容性未知 ?

Browser compatibility notes

keypress event is no longer fired for non-printable keys (见 bug 968056 for Firefox 65's implementation of this), except for the Enter key, and the Shift + Enter and Ctrl + Enter key combinations (these were kept for cross-browser compatibility purposes).

另请参阅

keypress event
相关事件处理程序
- GlobalEventHandlers.onkeydown
- GlobalEventHandlers.onkeyup

元数据

最后修改： Mar 18, 2019

在此页

句法

值

范例

基本范例

HTML

JavaScript

结果

Filter keys with a regular expression

HTML

JavaScript

结果

Capture the typing of a hidden word

规范

浏览器兼容性

图例

Browser compatibility notes

另请参阅

相关话题