事件类型及兼容

事件类型

window事件

onload 在浏览器完成对象的装载后立即触发
onresize 当对象的大小将要改变时触发

form事件

onblur 在对象失去输入焦点时触发
onfocus 当对象获得焦点时触发
onchange 在元素值被改变时触发
onsubmit 当表单将要被提交时触发
oncontextmenu 当上下文菜单(鼠标右键)被触发时运行的脚本
oninput 元素获得用户输入时运行的脚本

keyboard事件

onkeydown 键盘按键按下时触发
onkeyup 键盘按键抬起时触发
onkeypress 键盘按键敲击时触发

mouse事件

onclick 在用户用鼠标左键单击对象时触发
onmousedown 当用户用任何鼠标按钮单击对象时触发(鼠标按下)
onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发(鼠标抬起)
onmousemove 鼠标在某个区域内进行移动
onmouseover 当用户将鼠标指针移动到对象内时触发
onmouseout 当用户将鼠标指针移出对象边界时触发
onmousewheel 当鼠标滚轮按钮旋转时触发
onscroll 当用户滚动对象的滚动条时触发(有滚动条)

兼容

        //事件对象:
        document.onclick = function(e) {
            var e = e || window.event;
        };

        //事件绑定-目标元素
        document.onmouseover = function(e) {
            var e = e.target || e.srcElement;
        };

        //事件绑定
        //标准-addEventListener
        //IE - attachEvent
        function addEvent(obj, eventType, fn) {
            if (obj.addEventListener) { //标准
                obj.addEventListener(eventType, fn, false);
            } else {
                obj.attachEvent('on' + eventType, fn);
            }
        }

        //取消事件绑定
        //标准- removeEventListener
        //IE - detachEvent
        function removeEvent(obj, eventType, fn) {
            if (obj.addEventListener) { //标准
                obj.removeEventListener(eventType, fn, false);
            } else {
                obj.detachEvent('on' + eventType, fn);
            }
        }


        //取消冒泡
        //标准 - e.stopPropagation
        //IE - e.cancelBubble
        function deBubble(e) {
            if (e.stopPropagation) {
                e.stopPropagation();
            } else {
                e.cancelBubble = true;
            }
        }

        //键码获取
        function fn(e) {
            e.keycode || e.which
        }

        //阻止默认行为
        document.onmousedown = function(e) {
            if (e.preventDefault) {
                e.preventDefault()
            } else {
                e.returnValue = false;
            }
        }
        
        //获取样式
        function getStyle(obj, attr) {
            if (window.getComputedStyle) {
                return getComputedStyle(obj)[attr];
            } else {
                return obj.currentStyle[attr];
            }
        }
		//ajax
        function ajax() {
            var xml = '';
            if (window.XMLHttpRequest) { // 兼容 IE7+, Firefox, Chrome, Opera, Safari
                xml = new XMLHttpRequest();
            } else { // 兼容 IE6, IE5
                xml = new ActiveXObject("Microsoft.XMLHTTP");
            }
        }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值