JS事件汇总 JavaScript 事件JS事件汇总鼠标事件键盘事件表单事件读取事件onload与onpageshow事件区别 其它事件 addEventListener()添加事件监听
JavaScript 事件 HTML 事件是发生在 HTML 元素上的事情。当在 HTML 页面中使用 JavaScript 时, JavaScript 可以触发这些事件。HTML 事件可以是浏览器行为,也可以是用户行为。 JS事件汇总 鼠标事件 事件触发onclick点击时ondblclick双击时onmousedown按下左键释放之前onmouseup在页面元素上移动鼠标onmouseout指针移出元素范围onmouseover第一次移入指定元素范围onmouseup释放按下的左键时发生ondrag元素被拖动时ondragstart在拖动操作开端运行ondragend拖动操作末端运行ondragenter当元素元素已被拖动到有效拖放区域时ondragleave当元素离开有效拖放目标时运行ondragover当元素在有效拖放目标上正在被拖动时键盘事件 事件触发onkeypress用户按下一键未释放时onkeydown单击键盘时onkeyup键盘按下再放开时发生表单事件 事件触发onsubmit用户提交表单时发生onchange在域的内容改变时发生onreset表单数据被重置时发生onselect用户从文本框中选择文本时发生onfocus获得焦点时onblur失去焦点时触发读取事件 事件触发onabort用户停止浏览器继续下载图像时触发onerror当浏览器载入网页或图像发生错误时onload通常用于 body元素,在页面完全载入后触发(包括图片、css文件等等。)onresize窗口或框架被调整大小时发生。onunload用户离开页面时发生onload与onpageshow事件区别
onpageshow 事件在用户浏览网页时触发。
onpageshow 事件类似于 onload 事件,onload 事件在页面第一次加载时触发, onpageshow 事件在每次加载页面时触发,即onload 事件在页面从浏览器缓存中读取时不触发。
为了查看页面是直接从服务器上载入还是从缓存中读取,你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。 如果页面从浏览器的缓存中读取该属性返回 ture,否则返回 false
onpageshow事件
addEventListener(event, function, useCapture)
参数event必填,表示监听的事件,例如 click, touchstart 等,不加前缀on的事件。参数 function必填,表示事件触发后调用的函数,可以是外部定义函数,也可以是匿名函数。不带参数参数 useCapture选填,填true或者false,用于描述事件是冒泡还是捕获触发,true表示捕获,默认false表示冒泡。这里function参数传的是匿名函数,没办法用removeEventListener解除监听
window.addEventListener('resize', function() { console.log('resize')}, false)这里function参数传的不是匿名函数,可以用removeEventListener解除监听
function resizeFn(e) { console.log('resize') console.log(e)}window.addEventListener('resize', resizeFn, false)// 解除上面绑定的事件监听window.removeEventListener('resize', resizeFn, false)JS冒泡、捕获、默认事件那些事
js事件节流、防抖、事件委托
谢谢你阅读到了最后
期待你,点赞、评论、交流