-
什么是事件对象?在触发DOM上的事件时都会产生一个对象 例:function show(event){……} 参数event接收的就是事件传过来的对象 事件对象EVENT ①DOM中的事件对象 属性 (1)type属性用于获取事件类型 (2)target属性用于获取事件目标 (3)stopPropagation()方法 用于阻止事件冒泡 (4)preventDefault() 方法 阻止事件的默认行为 如果一个div里面有一个button,button和div都绑定了click事件,如果是事件冒泡,那么点击button的时候,首先触发button的处理函数,然后触发div的处理函数。(由内而外) 如果有时候不想冒泡,也就是不希望div的事件被触发,那么需要阻止事件冒泡,用stopPropagation()方法。 如果需要阻止a标签的默认属性跳转,可以使用阻止事件的默认行为preventDefault()方法。 <div id="box"> <input type="button" value="按钮1" id="btn1" /> <input type="button" value="按钮2" id="btn2" /> <input type="button" value="按钮3" id="btn3" /> <a href="https://www.baidu.com/" id="goTo">跳转</a> </div> <script> function showMessage(event){ //参数event接收的就是事件传过来的对象 alert(event.type); //type属性用于获取事件类型,此处输出:click //alert(event.target); //target属性用于获取事件目标,此处输出:[object HTMLInputElement] //alert(event.target.nodeName); //输出元素节点名称:input event.stopPropagation(); //stopPropagation()方法用于阻止事件冒泡 } function showBox(){ alert("这是盒子box"); }查看全部
-
跨浏览器事件处理,注意:在js中 element.onclick===element['click'] .可以用中括号【】代替查看全部
-
事件处理程序查看全部
-
执行步骤:在标题区域按下->要页面中移动->释放鼠标时停止移动 1、任何能够跟着鼠标移动的东西 都要有一个前提:绝对定位 2、鼠标事件都是在浏览器窗口中的特定位置上发生的。这个位置信息保存在事件的clientX和clientY属性中。 所有浏览器都支持这两个属性,它们的值表示事件发生时鼠标指针在视口中的水平和垂直坐标。不包括页面滚动的距离。 3、ie10以前版本不支持document.getElementsByClassName,所以要用js封装getClass方法,获取class 4、实现随鼠标拖动,需要让窗口的坐标随着鼠标移动,鼠标的坐标保存在事件的clientX和clientY两个属性中。 5、onmousedown鼠标按下,窗口和鼠标的位置同步;element.style.left/top=clientX/Y+'px'; 6、onmousemove当鼠标指针在元素内部移动时重复地触发 代码: function getClass(clsname,parent){ var parent=parent?document.getElementById(parent):document, elements=document.getElementsByTagName("*"), eles=[]; for(var i=0,l=elements.length;i<l;i++){ if(elements[i].className==clsname){ eles.push(elements[i]); } } return eles; } window.onload=function(){ var oTitle=getClass("login_title","box")[0]; oTitle.onmousedown=fnDown; } function fnDown(){ var box=document.getElementById("box"); document.onmousemove=function(event){ event=event||window.event; box.style.left=event.clientX+"px"; box.style.top=event.clientY+"px"; } }查看全部
-
键盘事件查看全部
-
bubble ~~~查看全部
-
document.getElementByClassName()方法IE10之前是不支持的 所以为了兼容 最好自己封装查看全部
-
element['on' + type] = handler; //变量和字符串不能用点连 element.'on'+type是错误的 function stopGo(event){ event.stopPropagation(); //阻止向上冒泡适用于DOM event.preventDefault(); //取消默认行为 IE不支持适用于DOM } event.returnValue=false;//适用于IE阻止默认行为; event.cancelBubble=true;//适用于IE阻止冒泡查看全部
-
stopPropogation()方法阻止事件冒泡 preventDefult()方法阻止默认行为 type 获取事件属性 target获取事件目标查看全部
-
是看你看查看全部
-
例子例子例子查看全部
-
element.onclick===element[onclick]查看全部
-
夸浏览器的事件处理可以恰当地使用能力检测查看全部
-
在js中 element.onclick===element['click'] .可以用中括号【】代替查看全部
-
2016.2.1查看全部
举报
0/150
提交
取消