JS事件监听是什么,如何设置事件监听
Admin 2022-08-23 群英技术资讯 584 次浏览
DOM允许我们书写JS代码,来让HTML元素对事件作出反应;
事件:用户与网页的交互动作;eg:点击网页;
监听:是为了让计算机随时能够发现这个事件发生了,从而执行程序员预先编写的一些程序;
设置事件监听的方法主要有onxxx和addEventListener()两种;
设置它们的onxxx属性;
oBox.onclick = function () { // 点击盒子时,将执行这里的语句 }
事件名 | 事件描述 |
---|---|
onclick | 当鼠标单机某个对象 |
ondblclick | 当鼠标双击某个对象 |
onmousedown | 当某个鼠标按键在某个对象上被按下 |
onmouseup | 当某个鼠标按键在某个对象上被松开 |
onmousemove | 当某个鼠标按键在某个对象上被移动 |
onmouseenter | 当鼠标进入某个对象(相似事件onmouseover) |
onmouseleave | 当鼠标离开某个对象(相似事件onmouseout) |
事件名 | 事件描述 |
---|---|
onkeypress | 当某个键盘的键被按下(系统按钮,如箭头键和功能键无法得到识别) |
onkeydown | 当某个键盘的键被按下(系统按钮可以识别,并且会先于onkeypress发生) |
onkeyup | 当某个键盘的键被松开 |
事件名 | 事件描述 |
---|---|
onchange |
当用户改变某个表单域的内容时,会触发 |
onfocus | 当某元素获得焦点(比如tab键或鼠标点击) |
onblur | 当某元素失去焦点 |
onsubmit | 当表单被提交 |
onreset | 当表单被重置 |
事件名 | 事件描述 |
---|---|
onload | 当页面或图像被完成加载 |
onunload | 当用户退出页面 |
先从外到内(捕获阶段),然后再从内到外(冒泡阶段)
而,onxxx这样的写法(DOM0级),只能监听冒泡阶段;所以需要用到addEventListener()方法(DOM2级);
oBox1.addEventListener('click', function(){ // 这是事件处理函数 }, true) // true表示监听捕获阶段,false表示监听冒泡阶段
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
Angular指令如何保持关注点的分离?本篇文章带大家了解一下通过 Angular 指令保持关注点分离的方法,希望对大家有所帮助!
这篇文章主要为大家详细介绍了JavaScript实现密码框验证信息,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
目录一、webpack介绍1、由来2、介绍3、作用4、拓展说明5、webpack整体认知二、webpack安装1、安装node2、安装cnpm3、安装nrm的两种方法4、安装webpack三、webpack配置0、搭建项目结构1、初始化一个项目(会创建一个package.json文件)2、在当前的项目中安装Webpac
这篇文章主要介绍了vue2.x 从vue.config.js配置到项目优化,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
这篇文章给大家分享的是node中进程通信的实现,下文给大家介绍了五种实现方式,文中示例代码供大家参考,需要的朋友可以了解看看,接下来就跟随小编一起学习一下吧。
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008