键盘事件

千次阅读 2019-01-21 13:28:08

键盘事件 键盘事件主要有三个：keydown、keypress、keyup。触发顺序分别是keydown、keypress、keyup。 document.onkeydown = function (e) { console.log(‘keydown’); } document.onkeypress = function (e) ...

键盘事件
键盘事件主要有三个：keydown、keypress、keyup。
触发顺序分别是keydown、keypress、keyup。
  document.onkeydown = function (e) {
      console.log(‘keydown’);
  }
  document.onkeypress = function (e) {
      console.log(‘keypress’);
  }
  document.onkeyup = function (e) {
      console.log(‘keyup’);
  }

输出的结果是keydown、keypress、keyup。
keydown和keypress可以响应连续操作，我们一直按着键盘就会一直触发事件。
keypress的范围和keydown有所区别：
keydown可以响应任意键盘按键，keypress只能响应字符类按键，也就是有ASCII码的字符的按键，像字母数字回车空格之类的。
事件对象的属性方面：
只有keypress有charCode属性，这个属性代表的我们输入的这个字符的ASCII码，配合SHIFT之类的按键可以直接获取大写字母等。
keyCode和which每个方法都有，表示的是这个键的唯一标示，可以告诉浏览器我们按下的是键盘上的哪一个键，比如空格是32，32就代表空格。不过我们一般都用which，keyCode用的较少。
• String上有一个方法叫做fromCharCode，可以接受一个Unicode值（包含ASCII值），然后返回对应的字符串，我们可以配合这个方法和charCode来直接获取输入的字符。
 document.onkeypress = function (e) {
     console.log(String.fromCharCode(e.charCode));
  }

窗体操作类（window上的事件）
load事件
这个事件window.onload和在body标签上写onload是一样的效果，作用是等页面中所有的东西都下载完成再执行里面的代码。
scroll事件
这个方法是监听滚轮滚动的事件，我们可以用这个事件来写一个兼容版的fix定位。
 function beFixed(ele){
      var initPosX = ele.getPosition().w,
          initPosY = ele.getPosition().h;
      addEvent(window, ‘scroll’, function(e){
          ele.style.top =  initPosY + getScrollOffset().h + ‘px’;
          ele.style.left =  initPosX + getScrollOffset().w + ‘px’;
      })
  }

收起

展开全文

js 键盘事件

万次阅读 2020-07-27 21:04:18

键盘事件：简单点就是检测用户在键盘上按了什么键 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src=...

键盘事件：简单点就是检测用户在键盘上按了什么键

 

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
        <script type="text/javascript">
            $(function() {
                window.document.onkeydown = keyHandler;
                keyHandler();
            })

            function keyHandler() {
                if(event.keyCode == 13) {//回车
                    alert("你按了回车哦！");
                }else{
                    alert("听话，不要调皮！");
                }
            }
        </script>
	</head>

    <body>
        点击键盘上的回车试试？
    </body>

</html>

收起

展开全文

C/C++获取键盘事件

万次阅读 多人点赞 2017-12-09 17:50:38

在vs中可以使用_kbhit()函数来获取键盘事件，使用时需要加入conio.h头文件，例：#include <conio.h> #include <iostream>using namespace std;int main() { int ch; while (1){ if (_kbhit()){//如果...

在vs中可以使用_kbhit()函数来获取键盘事件，使用时需要加入conio.h头文件，例：
#include <conio.h>
#include <iostream>

using namespace std;

int main()
{
	int ch;
	while (1){
		if (_kbhit()){//如果有按键按下，则_kbhit()函数返回真
			ch = _getch();//使用_getch()获取按下的键值
			cout << ch;
			if (ch == 27){ break; }//当按下ESC时退出循环，ESC键的键值是27.
		}
	}
	system("pause");
	return 0;
}


键盘的键值是遵循ASCII码码表的，对应键值如下：

收起

展开全文

函数

Js-三大事件（鼠标事件、键盘事件、html事件）

万次阅读 多人点赞 2017-08-23 19:01:44

鼠标事件、键盘事件、html事件

鼠标事件
click：单击
dblclick：双击
mousedown：鼠标按下
mouseup：鼠标抬起
mouseover：鼠标悬浮
mouseout：鼠标离开
mousemove：鼠标移动
mouseenter：鼠标进入
mouseleave：鼠标离开
<button οnclick="myClick()">鼠标单击</button>
<button οndblclick="myDBClick()">鼠标双击</button>
<button οnmοusedοwn="myMouseDown()" οnmοuseup="myMouseUp()">鼠标按下和抬起</button>
<button οnmοuseοver="myMouseOver()" οnmοuseοut="myMouseOut()">鼠标悬浮和离开</button>
<button οnmοusemοve="myMouseMove()">鼠标移动</button>
<button οnmοuseenter="myMouseEnter()" οnmοuseleave="myMouseLeave()">鼠标进入和离开</button>
<script>
    function myClick() {
        console.log("你单击了按钮！");
    }
    function myDBClick() {
        console.log("你双击了按钮！");
    }
    function myMouseDown() {
        console.log("鼠标按下了！");
    }
    function myMouseUp() {
        console.log("鼠标抬起了！");
    }
    function myMouseOver() {
        console.log("鼠标悬浮！");
    }
    function myMouseOut() {
        console.log("鼠标离开！")
    }
    function myMouseMove() {
        console.log("鼠标移动！")
    }
    function myMouseEnter() {
        console.log("鼠标进入！")
    }
    function myMouseLeave() {
        console.log("鼠标离开！")
    }
键盘事件
keydown：按键按下
keyup：按键抬起
keypress：按键按下抬起
<body>
<input id="name" type="text" οnkeydοwn="myKeyDown(this.id)" οnkeyup="myKeyUp(this.id)">
</body>
<script>
    /*输出输入的字符*/
    function myKeyDown(id) {
        console.log(document.getElementById(id).value);
    }
    /*按键结束，字体转换为大写*/
    function myKeyUp(id) {
        var text = document.getElementById(id).value;
        document.getElementById(id).value = text.toUpperCase();
    }
</script>
HTML事件
load：文档加载完成
select：被选中的时候
change：内容被改变
focus：得到光标
resize：窗口尺寸变化
scroll：滚动条移动
<body οnlοad="loaded()">
<div style="height: 3000px" ></div>
<input type="text" id="name" οnselect="mySelect(this.id)">
<input type="text" id="name2" οnchange="myChange(this.id)">
<input type="text" id="name3" οnfοcus="myFocus()">
</body>
<script>
    window.onload = function () {
        console.log("文档加载完毕！");
    };
    /*window.onunload = function () {
     alert("文档被关闭！");
     };*/
    /*打印选中的文本*/
    function mySelect(id) {
        var text = document.getElementById(id).value;
        console.log(text);
    }
    /*内容被改变时*/
    function myChange(id) {
        var text = document.getElementById(id).value;
        console.log(text);
    }
    /*得到光标*/
    function myFocus() {
        console.log("得到光标！");
    }
    /*窗口尺寸变化*/
    window.onresize = function () {
        console.log("窗口变化！")
    };
    /*滚动条移动*/
    window.onscroll = function () {
        console.log("滚动");
    }
</script>
事件模型：
<body>
<!--脚本模型：行内绑定-->
<button οnclick="alert('hello')">hello</button>
<!--内联模型-->
<button οnclick="showHello()">hello2</button>
<!--动态绑定-->
<button id="btn">hello3</button>
</body>
<script>
    function showHello() {
        alert("hello");
    }
    /*DOM0：同一个元素只能添加一个同类事件
     * 如果添加多个，后面的会把前面的覆盖掉*/
    var btn = document.getElementById("btn");
    btn.onclick = function () {
        alert("hello");
    };
    btn.onclick = function () {
        alert("hello world");
    };
    /*DOM2:可以给一个元素添加多个同类事件*/
    btn.addEventListener("click", function () {
        alert("hello1");
    });
    btn.addEventListener("click", function () {
        alert("hello2");
    });
    /*不同浏览器的兼容写法*/
    /*IE*/
    if (btn.attachEvent) {
        btn.attachEvent("onclick", function () {
            alert("hello3");
        });
    /*W3C*/
    } else {
        btn.addEventListener("click", function () {
            alert("hello4");
        })
    }
</script>
事件冒泡与事件捕获：
 <style>
        #div1{
            width: 400px;
            height: 400px;
            background-color: #0dfaff;
        }
        #div2{
            width: 300px;
            height: 300px;
            background-color: #33ff66;
        }
        #div3{
            width: 200px;
            height: 200px;
            background-color: #fff24a;
        }
        #div4{
            width: 100px;
            height: 100px;
            background-color: #ff4968;
        }
    </style>
 <title>事件冒泡、事件捕获</title>
</head>
<body>
<div id="div1">
    <div id="div2">
        <div id="div3">
            <div id="div4">

            </div>
        </div>
    </div>
</div>
</body>
<script>
    var div1 = document.getElementById("div1");
    div1.addEventListener("click",function (event) {
        /*阻止事件冒泡*/
        event.stopPropagation();
        alert("div1");
    },false);
    var div2 = document.getElementById("div2");
    div2.addEventListener("click",function (event) {
        /*阻止事件冒泡*/
        event.stopPropagation();
        alert("div2");
    },false);
    var div3 = document.getElementById("div3");
    div3.addEventListener("click",function (event) {
        /*阻止事件冒泡*/
        event.stopPropagation();
        alert("div3");
    },false);
    var div4 = document.getElementById("div4");
    div4.addEventListener("click",function (event) {
        /*阻止事件冒泡*/
        event.stopPropagation();
        alert("div4");
    },false);
</script>
阻止默认事件：
<body>
<a href="http://www.baidu.com" οnclick="stop(event)">百度</a>
</body>
<script>
    function stop(event) {
        if (event.preventDefault()) {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
        alert("不跳转！")
    }
</script>

收起

展开全文

javascript

JavaScript回车事件等键盘事件
2020-07-09 21:31:09
JavaScript回车事件等键盘事件JavaScript键盘事件键盘事件属性键盘响应顺序JavaScript 监听回车事件Keycode对照表 JavaScript键盘事件在 JavaScript 中，当用户操作键盘时，会触发键盘事件，键盘事件主要包括下面 3...
收起
javascript vue.js 前端
Java键盘事件
千次阅读 2018-02-06 16:53:06
键盘事件的事件源一般丐组件相关，当一个组件处于激活状态时，按下、释放或敲击键盘上的某个键时就会发生键盘事件。键盘事件的接口是KeyListener，注册键盘事件监视器的方法是addKeyListener(监视器)。实现...
收起
java 键盘事件
千次阅读 2015-09-23 22:48:52
package 键盘事件; public class Main { public static void main(String[] args) { // TODO Auto-generated method stub KeyEvent1 win=new KeyEvent1(); win.setTitle("键盘事件"); } } package 键盘...
收起
java
JQuery键盘事件
千次阅读 2019-03-31 17:48:38
《JQuery键盘事件》开发工具与关键技术：前端 && 谷歌浏览器作者：肖春庆撰写时间：2019年02月15日 JQuery提供了对应键盘事件keydown事件,keyup事件和keyprees事件。一、keydown事件：当按下键盘按钮时...
收起
键盘事件处理
2018-12-12 19:22:49
目前，对键盘事件的支持主要遵循的是 DOM0级。按键相关事件键盘操作涉及下面三种事件： keydown：当用户按下键盘上的任意键时触发，而且如果按住按住不放的话，会重复触发此事件。 keypress：当用户按下键盘上的...
收起
请问大佬们，如何局部监听键盘事件，比如只监听Dialog 对话框里的键盘事件
2020-01-09 08:51:50
请问大佬们，如何局部监听键盘事件，比如只监听Dialog 对话框里的键盘事件
收起
javascript jquery vue.js
重新认识键盘与鼠标——键盘事件与鼠标事件
千次阅读 2020-04-26 19:41:50
一、键盘事件 1.1 VB提供三种键盘事件：KeyPress、KeyDown和KeyUp。如果按下键盘上一个会产生ASCII码的字符键（字母键、数字键和符号键）时，就会触发keyPress事件；如果按下键盘上的任意键，就会触发KeyDown...
收起
jQuery键盘事件
2019-06-09 20:39:38
jQuery键盘事件在鼠标中有mousedown和mouseup之类的事件，都是根据我们所需的要求而触发。键盘的按下与弹起，对这样的2种动作，jQuery分别提供了对应keydown与keyup方法来监听。 Keydown事件：当在一个元素第一次...
收起
Android开发键盘事件移动米老鼠案例
万次阅读 2021-03-10 11:42:20
MainAcitity.java文件 ... import android.os.Bundle; import android.view.KeyEvent; import android.view.View; import android.widget.ImageView;...import android.widget.LinearLayout;...import androidx.appcompat.app...
收起
移动开发 android
C# 键盘事件
2017-02-09 15:47:01
键盘事件 三种键盘事件处理 KeyPress 按下按键并松开 KeyDown 按下按键 KeyUp 松开按键 键盘事件跟鼠标事件一样，也有两种键盘处理参数： KeyEventArgs KeyPressEventArgs 可以使用e....
收起
Java GUI 键盘事件
万次阅读 多人点赞 2019-08-13 19:29:56
import java.awt.FlowLayout; import java.awt.Frame; import java.awt.TextField; import java.awt.event.KeyAdapter; import java.awt.event....public class Java键盘事件 { public static void main(String...
收起
Java GUI
Qt 鼠标事件，键盘事件
千次阅读 2016-11-23 20:33:17
Qt鼠标事件 Qt键盘事件 Qt事件处理
收起
Qt鼠标事件 Qt事件处理
JAVA JTable 自定义CellEditor中定义了键盘事件，输入时确不响应键盘事件?
2018-10-17 16:18:41
但在我在表格中输入的时候，使用鼠标点击单格后再输入值，可以正常响应键盘事件，但是用键盘选中该单元格后再输入值时，可以输入任意字符，键盘事件不被触发，定义的输入规则无用。请教高手，如何解决这个问题。
收起
java jtable
jQuery键盘事件，绑定事件与移除事件，复合事件
千次阅读 2018-11-17 18:28:13
键盘事件是指每次按下或者释放键盘上得按键时所产生的事件，常用的键盘事件的方法： keydown() :按下键盘时触发的事件方法； keyup() :释放按键时触发的事件方法； keypress() :产生可打印的字符时触发的事件...
收起
JavaFX键盘事件
千次阅读 2019-03-28 23:54:27
一、键盘事件 KeyPressed 按键按压 KeyReleased 按键释放 KeyTyped 按键类型二、用法 node.setOnXX(event->{ //do something }); node.addEventFilter(KeyEvent.XX, event -> { //do something ...
收起
JavaScript 事件之键盘事件
2016-06-02 22:04:54
键盘事件包含onkeypress、onkeydown 和 onkeyup。 onkeypress事件是在键盘上的某个键被按下并且释放时触发此事件的处理程序，一般用于键盘上的单键操作； onkeydown事件是在键盘上的某个键被按下时触发此事件的...
收起
VTK鼠标键盘事件
千次阅读 2019-04-30 10:32:28
VTK鼠标键盘事件会优先于QT的鼠标键盘事件，而且会吃掉这些事件，使得QT的 //void mouseMoveEvent(QMouseEvent * event) override; 这种事件得不到执行。这主要是通过QVTKOpenGLWidget类来实现的。所以我们...
收起
react添加监听事件监听键盘事件
千次阅读 2019-06-21 17:26:26
1，react添加监听事件监听键盘事件 参考：记录下确认框confirm代码：
收起
JavaScript 键盘事件
千次阅读 2016-12-14 20:09:52
JavaScript 键盘事件有以下3种 keydown 键盘按键按下（如果按着不放，会持续触发该事件） keypress 键盘非功能按键按下（在keydown之后触发，如果按着不放会持续触发该事件）。 keyup 键盘按键弹起。全局事件...
收起
javascript
嵌入式linux 键盘事件
2018-05-02 07:06:55
嵌入式arm板子插入USB键盘，自动产生/dev/input/event4节点，键盘按键event4有输出，但是系统应用程序相应不到按键。该怎么把event的键盘事件 上报给系统层？怎么办啊。
收起
linux 嵌入式
js 键盘事件及其他事件
2018-07-22 20:16:02
常用的键盘事件 。 onkeydown 某个键盘按键被按下。 onnkeyup 某个键盘的按键被松开。onkeypress 某个键盘的按键被按下并松开。 onkeydown与onkeypress的区别。一个放开一个没有放开 onkeydown先于...
收起

键盘事件

js 键盘事件

C/C++获取键盘事件

Js-三大事件（鼠标事件、键盘事件、html事件）

JavaScript回车事件等键盘事件

Java键盘事件

java 键盘事件

JQuery键盘事件

键盘事件处理

请问大佬们，如何局部监听键盘事件，比如只监听Dialog 对话框里的键盘事件

重新认识键盘与鼠标——键盘事件与鼠标事件

jQuery键盘事件

Android开发键盘事件移动米老鼠案例

C# 键盘事件

Java GUI 键盘事件

Qt 鼠标事件，键盘事件

JAVA JTable 自定义CellEditor中定义了键盘事件，输入时确不响应键盘事件?

jQuery键盘事件，绑定事件与移除事件，复合事件

JavaFX键盘事件

JavaScript 事件之键盘事件

VTK鼠标键盘事件

react添加监听事件监听键盘事件

JavaScript 键盘事件

嵌入式linux 键盘事件

js 键盘事件及其他事件

键盘事件