在某网课学习前端笔记整理js篇30-js事件续

js事件续

oncontextmenu: 右击弹出的菜单事件。

复制： oncopy 。

选择： onselectstart 。

example1

//阻止默认事件(这里阻止的是鼠标右键弹出默认菜单)
document.oncontextmenu = function(e){
    e = e || event;
    e.preventDefault();
    //return false;
}

​ 鼠标事件的事件对象event可以通过button获取到鼠标的点击动作（比如0）。键盘事件可以通过keyCode获取按的键盘码。

example2

document.onmousedown = function(e){
    e = e || event;
    console.log(e.button);//0:鼠标左键 1：滚轮键 2：鼠标右键
}
document.onkeydown = function(e){
    e = e || event;
    console.log(e.keyCode);//32:空格
}

example3

//组合键
var keys = ['','','',''];
var compinekey = '81,87,69,82';//qwer
document.onkeydown = function(e){
    e = e || event;
    var k = e.keyCode;
    keys.push(k);
    keys.shift();
    if(keys.join(',').indexOf(compinekey)!=-1){
        alert('ok');
    }
}

滚轮滚动： 滚轮事件 。好像个别浏览器不支持onmousewheel，支持DOMMouseScroll,获取滚轮值方法也不一样，event.wheelDelta（-下上+）和event.detail(+下上-)。

example4

//滚轮事件 好像个别浏览器不支持onmousewheel，支持DOMMouseScroll,获取滚轮值方法也不一样，event.wheelDelta（-下上+）和event.detail(+下上-)
function onWheel(el, fn){
    if(el.onmousewheel === null){
        el.onmousewheel = fn;
    }else{
        el.addEventListener('DOMMouseScroll', fn);
    }
}

自定义事件： ie9-不支持好像。

example5

//创建事件对象
var tds = document.createEvent('UIEvents');
//初始化事件对象 参数：名字 是否冒泡 是否阻止默认事件
tds.initEvent('tds2',true,true);
tds.name='tds';
//添加事件
document.addEventListener('tds2',function(e){
    console.log(e.name);
});
//触发事件
document.dispatchEvent(tds);