-
缺点:html代码和js代码耦合在一起了。查看全部
-
最终的结果就是,放心大胆的使用事件冒泡吧!现在IE、chrome都支持了事件捕获。查看全部
-
button->div->body->html->document查看全部
-
IE事件流是事件冒泡流;网景事件流是事件捕获流。查看全部
-
事件流,描述的是从页面中接受事件的顺序。查看全部
-
事件冒泡:最集体的--逐级传递到最不具体的 span -> div -> body ->html 时间捕获:最不具体的逐级传递到最具体的 html -> body -> div -> span查看全部
-
IE中的事件对象 1. type属性 事件类型 2. srcElement 获取事件目标 3. cancelBubble属性用于阻止事件冒泡(true表示阻止冒泡,false表示不阻止) 4 returnValue阻止事件默认行为(false阻止行为) getEvent:function(event){ //非IE:event IE:window.event return event?event:window.event; }, getType:function(event){ return event.type; //非IE与IE相同 }, getElement:function(event){ //非IE:event.target IE:event.srcElement return event.target event.srcElement; }, preventDefault:function(event){ //判断对象方法是否存在时,要将方法当做属性来判断[函数名后不加小括号:if(对象.方法函数)],很多方法没有返回值,即使有返回值也不一定是布尔值,当if(方法函数())时会出现不可预料的结果 if(event.preventDefault){ event.preventDefault(); //非IE方法处理 }else{ event.returnValue=false; //IE属性处理 } }, stopPropagation:function(event){ if(event.stopPropagation){ event.stopPropagation(); //非IE方法处理 }else{ event.cancelBubble=true; //IE属性处理 } }查看全部
-
什么是事件对象?在触发DOM上的事件时都会产生一个对象 事件对象EVENT ①DOM中的事件对象 属性 (1)、type属性用于获取事件类型 (2)、target属性用于获取事件目标 (3)、stopPropagation()方法 用于阻止事件冒泡 (4)、preventDefault() 方法 阻止事件的默认行为 如果一个div里面有一个button,button和div都绑定了click事件,如果是事件冒泡,那么点击button的时候,首先触发button的处理函数,然后触发div的处理函数。(由内而外) 如果有时候不想冒泡,也就是不希望div的事件被触发,那么需要阻止事件冒泡。stopPropagation()方法 如果需要阻止a标签的默认属性跳转,可以使用阻止事件的默认行为preventDefault()方法 IE8以下事件对象(window.event) 1.事件类型:event.type 2.事件目标:event.target 3.阻止事件冒泡:event.cancelBubble = true 4.阻止默认事件:event.returnValue = false查看全部
-
var eventUtil={ //添加句柄 //支持DOM2级、IE、DOM0级 addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListenter(type,handler,false); } else if(element.attachEvent){ element.attachEvent('on'+type,handler); }else{ element['on'+type]=handler; } }, //删除句柄 removeHandler:function(element,type,handler){ if(element.romoveEventListener){ element.romoveEventListenter(type,handler,false); } else if(element.detachEvent){ element.detachEvent('on'+type,handler); }else{ element['on'+type]=null; } } } } element.eventuntil(btn3,'click',message);查看全部
-
// 封装添加事件监听程序 function addEvent(ele, type, hander){ if(ele.addEventListener){ ele.addEventListener(type, hander, false); } else if(ele.attachEvent){ ele.attachEvent('on' + type, hander); } else { ele['on' + type] = hander; } }查看全部
-
有三种方法能够确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)。 对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari: window.innerHeight - 浏览器窗口的内部高度 window.innerWidth - 浏览器窗口的内部宽度 对于 Internet Explorer 8、7、6、5: document.documentElement.clientHeight document.documentElement.clientWidth 或者 document.body.clientHeight document.body.clientWidt 拖拽->鼠标跟随 1、绑定鼠标点击事件 2、获取鼠标坐标:clientX clientY (所有浏览器都支持此属性) 3、为容器元素绑定onmousemove (表明可拖拽元素只在容器元素内可拖拽) 4、将拖拽元素设置成绝对定位 5、在onmousemove中改变拖拽元素的left、top (注意left、top的算法) 6、设置left、top限定,禁止元素拖出窗口 7、当前浏览器窗口宽度document.documentElement.clientWidth或document.body.clientWidth 8、拖拽元素绑定onmouseup事件,在此事件中注销onmousemove事件,完成元素拖拽的释放效果 注意可以把left、top理解成x轴、y轴查看全部
-
DOM0级程序处理查看全部
-
ul列表查看全部
-
鼠标划过和离开的状态查看全部
-
让div在页面范围内移动查看全部
举报
0/150
提交
取消