JavaScript(js)处理的HTML事件、键盘事件、鼠标事件



示例代码:
HTML文件:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML文件</title>
    <script>
        window.onload=function () {
            var d=document.getElementById('d');
            //内容发生改变,并焦点发生改变,才可以监听到
            d.onchange=function () {
                alert('内容发生改变')
            }
        }
    </script>
</head>
<body>
<input type="text" id="d" value="">
</body>
</html>
键盘事件:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>键盘事件</title>
    <script>
        window.onload=function () {
            window.onkeypress=function (e) {
             //   alert(e.key)//弹出按键对应的字母
             //   alert(e.keyCode)
                if (e.charCode==103){
                    alert('G键被点击')
                }
            }
        }
    </script>
</head>
<body>
</body>
</html>
鼠标事件:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>鼠标事件</title>
    <script>
        window.onload=function () {
            var input=document.getElementById('b');
            input.onclick=function () {
                alert('按钮被点击了');
            }
var c= document.getElementById('c');
            c.ondblclick=function () {
                alert('双击')
            }
        }
    </script>
</head>
<body>
<input type="button" id="b" value="点击">
<input type="button" id="c" value="双击">
</body>
</html>
JavaScript(js)处理的HTML事件、键盘事件、鼠标事件的更多相关文章
- winform中键盘和鼠标事件的捕捉和重写(转)
		
在 编写winform应用程序时,有时需要无论在哪个控件获取焦点时,对某一个键盘输入或者鼠标事件都进行同样的操作.比如编写一个处理图片的应用程序时, 希望无论当前哪个控件获得焦点,当用户按上.下.左. ...
 - winform中键盘和鼠标事件的捕捉和重写
		
在编写winform应用程序时,有时需要无论在哪个控件获取焦点时,对某一个键盘输入或者鼠标事件都进行同样的操作.比如编写一个处理图片的应用程序时,希望无论当前哪个控件获得焦点,当用户按上.下.左.右键 ...
 - WPF之路-键盘与鼠标事件 - 简书
		
原文:WPF之路-键盘与鼠标事件 - 简书 键盘事件 事件类型分为以下几个类型 生命周期事件:在元素加载与卸载的时候发生 鼠标事件:鼠标动作 键盘事件:键盘动作 手写笔事件:适用于win7以上的系统 ...
 - cocos2d-x 键盘和鼠标事件
		
出了菜单可以响应用户事件外,cocos2d中的层(Layer)也可以响应事件.层能够自动响应窗口事件,这些事件主要是键盘和鼠标事件,cocos2d中事件处理是通过Pyglet的事件处理完成的. 1.键 ...
 - js课程 5-13  js事件绑定和鼠标事件注意事项有哪些
		
js课程 5-13 js事件绑定和鼠标事件注意事项有哪些 一.总结 一句话总结:js代码的灵魂就是改变标签的属性和样式,就这两种. 1.js触发改的东西是哪两样? 属性和样式 2.js如何让页面用标 ...
 - WPF嵌入Unity3D之后,unity3D程序的键盘和鼠标事件无法触发(3D程序的焦点无法激活)的解决方案
		
目前最通用的客户端调用3D的方式,就是WPF程序通过Process启动Unity3D的exe进程,直接上代码: //开启3D进程 internal void Create3DProcess(strin ...
 - js Dom为页面中的元素绑定键盘或鼠标事件
		
html鼠标事件 onload 页面加载 onclick 鼠标单击 onmouseover 鼠标移入 onmouseout 鼠标移出 onfocus 获取焦点 onblur 失去焦点 onchange ...
 - javaScript事件(五)事件类型之鼠标事件
		
一.事件 二.事件流 以上内容见:javaScript事件(一)事件流 三.事件处理程序 四.IE事件处理程序 以上内容见javaScript事件(二)事件处理程序 五.事件对象 以上内容见javaS ...
 - Selenium2+python自动化12-操作元素(键盘和鼠标事件)
		
前言 在前面的几篇中重点介绍了一些元素的到位方法,到位到元素后,接下来就是需要操作元素了.本篇总结了web页面常用的一些操作元素方法,可以统称为行为事件 有些web界面的选项菜单需要鼠标悬停在某个元素 ...
 - 自动化测试-8.selenium操作元素之键盘和鼠标事件
		
前言 在前面的几篇中重点介绍了一些元素的定位方法,定位到元素后,接下来就是需要操作元素了.本篇总结了web页面常用的一些操作元素方法,可以统称为行为事件 有些web界面的选项菜单需要鼠标悬停在某个元素 ...
 
随机推荐
- PAT——1069. 微博转发抽奖
			
小明PAT考了满分,高兴之余决定发起微博转发抽奖活动,从转发的网友中按顺序每隔N个人就发出一个红包.请你编写程序帮助他确定中奖名单. 输入格式: 输入第一行给出三个正整数M(<= 1000).N ...
 - 解析oracle对select加锁的方法以及锁的查询 转
			
转自 https://www.jb51.net/article/37587.htm 本篇文章是对oracle对select加锁的方法以及锁的查询进行了详细的分析介绍,需要的朋友参考下 解析oracle ...
 - 404 Note Found 队-Alpha9
			
目录 组员情况 组员1(组长):胡绪佩 组员2:胡青元 组员3:庄卉 组员4:家灿 组员5:凯琳 组员6:翟丹丹 组员7:何家伟 组员8:政演 组员9:黄鸿杰 组员10:刘一好 组员11:何宇恒 展示 ...
 - ovs加dpdk出现EAL No free hugepages reported in hugepages-1048576kB
			
问题 打开ovs的日志: cat /etc/local/var/log/openvswitch/ovs-vswichd.log 其中一条显示: 2018-07-30T02:12:05.443Z|000 ...
 - php版本低更换php版本-问题以解决
			
Parse error: syntax error, unexpected 'class' (T_CLASS), expecting identifier (T_STRING) or variable ...
 - iOS开发Mac配置(CocoaPods、SourceTree、ssh key)
			
作为开发,有一个自己的饭碗还是有必要的.因为交接旧电脑的时候,你会遇到了一些问题,而自己的电脑就方便很多了. 要开发,当然要装一些与开发相关的东西,那么新电脑入手,要做些什么呢? 1.安装Xcode: ...
 - pt-archiver数据归档
			
可以使用percona-toolkit包中的pt-archiver工具来进行历史数据归档 pt-archiver使用的场景: 1.清理线上过期数据. 2.清理过期数据,并把数据归档到本地归档表中,或者 ...
 - CentOS7集成Apache和SVN
			
本文主要介绍如何在CentOS7环境下集成Apache和SVN,完成后可以通过浏览器访问SVN仓库. 1.查看系统环境,关闭防火墙和SELinux. [root@Docker /]# systemct ...
 - webpack管理输出
			
管理html的bundle依赖 html-webpack-plugin可以自动给html添加bundle文件 npm install --save-dev html-webpack-plugin co ...
 - Node.js http.createServer 简单服务配置
			
基本实现: var http = require("http"); var server = http.createServer(function (req, res) { if ...