![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JS事件对象
weixin_40025586
这个作者很懒,什么都没留下…
展开
-
JS事件对象--1(事件对象作用及兼容)
一.事件对象的作用 1.可以获得和哪个按键结合 2.可以获得点击所在的位置 3.可以获得点击所对应的标签: 二.浏览器兼容:形参对象是针对于现代浏览器,IE浏览器不能通过形参无法通过形参获得对象,通过window.event来获得,即console.log(window.event)。 1.兼容操作方法:var ev=e || window.event; --此处为:或语法,返回为真的值。...原创 2018-09-27 23:06:51 · 623 阅读 · 0 评论 -
JS事件对象(练习与复习)--碰撞检测(函数回调)
1.碰撞检测: CSS+Body部分: <style type="text/css"> #first { width:100px; height:100px; background:pink; position:absolute; } #second{ width:100px; height:100px; background:blue; pos...原创 2018-10-17 22:53:46 · 298 阅读 · 0 评论 -
JS事件对象--表单事件
1.表单事件: (1).焦点 获得焦点:onfocus 失去焦点:onblur (2).表单提交: 函数:submit(); (3).select,checkbox,radio,text在修改完以后发生改变: onchange函数 4.输入框修改过程中进行监听值 oninput函数 2.实际例化 body部分 <form action="index.html" method="post"&g...原创 2018-10-15 22:49:43 · 218 阅读 · 0 评论 -
JS事件对象--移动端事件--TouchJS使用
1.事件代理: touch.on(element, types, selector,callback); 功能描述:事件绑定方法,根据参数区分事件绑定和事件代理。 参数描述: 参数 描述 作用 element element或string 事件代理元素对象、选择器 ...原创 2018-10-19 13:13:14 · 1408 阅读 · 0 评论 -
JS事件对象--移动端事件--摇一摇
1.移动端事件–摇一摇: 微信摇一摇功能JS封装函数为: //添加事件 function shake(callBack) { var last_x=last_y=last_z=0; var last_time=new Date().getTime(); function initional() { if(window.DeviceMotionEvent) {window.ad...原创 2018-10-18 11:32:12 · 419 阅读 · 0 评论 -
JS事件对象7--滚轮事件(练习与复习)
鼠标滚轮事件综述: onmousewheel:滚轮事件 //针对非火狐浏览器 window.onmousewheel=function(e) { ev=e||window.event; //ev.wheelDelta:可以获得一个数值 //向下滚动是正值 //向上滚动是负值 } //火狐浏览器滚动方式 window.addEvent...原创 2018-10-09 22:07:25 · 214 阅读 · 0 评论 -
JS事件对象5--阻止默认事件(鼠标事件)
阻止默认事件的两种方式和兼容方式: &lt;script type="text/javascript"&gt; //阻止系统默认事件的两种方式: //1.IE:return false; //2.现代浏览器:事件对象.preventDefault(); 阻止默认事件的鼠标按下和右键具体操作: //wrap和a是事先声明好的id样式和标签 var a=document.querySele...原创 2018-10-09 22:07:34 · 2749 阅读 · 0 评论 -
JS事件对象6--键盘事件部分
键盘类事件综述: 1.键盘类的事件都是添加到window上,一般有 onkeydown,onkeyup,onkeypress三种事件。 2.onkeydown和onkeypress比较: (1) onkeydown比onkeypress先执行 (2)onkeydown基本支持一切的按键 onkeypress不支持一些功能键,例如:上下左右键,F1- F12,Tab,...原创 2018-10-09 22:07:43 · 449 阅读 · 0 评论 -
JS事件对象4--事件监听-陷阱实例(移入移出实践)
移入移出实践及注意事项: 1.html+CSS部分: &lt;style type="text/css"&gt; *{ margin:0; padding:0; } #wrap{ width:200px; height:200px; background:green; position:relative; margin:0 auto;...原创 2018-09-28 23:06:49 · 340 阅读 · 0 评论 -
JS事件对象--3(事件冒泡和事件监听)
一.事件–事件冒泡: 事件冒泡的含义和阻止冒泡的兼容写法: &lt;script type="text/javascript"&gt; // 事件冒泡:如果两个或者多个标签叠在一起,一旦这几个标签都有事件触发, // 那么点击的时候会同时触发这些事件称之为事件冒泡。 var wrap=document.getElementById('wrap'); var first=document.g...原创 2018-09-28 22:59:41 · 247 阅读 · 0 评论 -
JS事件对象--2(鼠标事件小例子)
一.鼠标事件小例子: CSS部分: <style type="text/css"> *{ margin:0; padding:0; } #wrap{ width:180px; height:180px; background:red; position:absolute; } </style> JS部分: <sc...原创 2018-09-28 22:44:35 · 100 阅读 · 0 评论 -
JS事件对象--移动端事件--touch(触摸事件)
1.触摸事件 touchstart:开始点击 touchmove:点击后开始移动 touchend:手抬起时点击结束 touchcancel:当点击过程中电话阻止事件时 2.移动端的事件对象的常用属性: (1)Touch常用的DOM属性: touches:表示当前跟踪的触摸操作的Touch对象的数组–点击触摸时有多少个Touch对象 targetTouches:特定于事件目标的Touch对象的数组...原创 2018-10-21 22:44:57 · 922 阅读 · 0 评论