Skip to content

onkeyup.md

Latest commit

 

History

History
106 lines (77 loc) · 2.75 KB

onkeyup.md

File metadata and controls

106 lines (77 loc) · 2.75 KB

HTML onkeyup 事件属性

当用户释放键时触发

示例

当用户释放键时执行 JavaScript：

当用户在输入字段中释放一个键时触发一个函数。 该函数将字符转换为大写。<br>
输入你的名字：<input type="text" id="fname" onkeyup="myFunction()">
<script>
  function myFunction() {
    var x = document.getElementById("fname");
    x.value = x.value.toUpperCase();
  }
</script>
<input type="text" onkeyup="myFunction()">

定义和使用

onkeyup 属性在用户释放一个键（在键盘上）时触发。

提示： onkeyup 事件相关的事件顺序：

  1. onkeydown
  2. onkeypress
  3. onkeyup

浏览器支持

事件属性 chrome edge firefox safari opera
onkeyup Yes Yes Yes Yes Yes

语法

<element onkeyup="script">

属性值

值 Value 描述 Description
script 要在 onkeyup 上运行的脚本

技术细节
支持的 HTML 标签: 所有 HTML 元素，除了: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, 和 <title>

更多示例

将 onkeydown 与onkeyup 属性一起使用：

<input type="text" id="demo" onkeydown="keydownFunction()" onkeyup="keyupFunction()">
<script>
function keydownFunction() {
  document.getElementById("demo").style.backgroundColor = "red";
}
function keyupFunction() {
  document.getElementById("demo").style.backgroundColor = "green";
}
</script>
<input type="text" onkeydown="keydownFunction()" onkeyup="keyupFunction()">

示例

输出在文本字段中释放的实际键：

当用户在输入字段中释放一个键时触发一个函数。 该函数输出在文本字段内释放的实际键/字母。<br>
输入你的名字：<input type="text" id="fname" onkeyup="myFunction()">
<p>我的名字是：<span id="demo"></span></p>

<script>
  function myFunction() {
    var x = document.getElementById("fname").value;
    document.getElementById("demo").innerHTML = x;
  }
</script>