2016.12.8 JS

target

event.target：指的是真实触发事件的元素，指出那个触发的

addEventListener(事件类型(字符串),事件类型(字符串),true/false 就写false，)

removeEventListener(事件类型(字符串),事件类型(字符串),true/false 就写false，)

//推荐使用addEventListener

键盘事件

onkeydown : 当键盘按键按下的时候触发

onkeyup : 当键盘按键抬起的时候触发

event.keyCode : 数字类型 键盘按键的值 键值

上下左右移动

event.ctrlKey, event.shiftKey, event.altKey

当一个事件发生的时候，如果ctrl || shift || alt 是按下的状态，相应的属性值返回true，否则返回false

至于能够接收焦点的元素才能够接收键盘事件（input）

阻止默认行为

event.preventDefault();

右键菜单事件oncontextmenu

右键菜单事件，当右键菜单（环境菜单）显示出来的时候

触发可以自定义右键菜单栏

拖拽

onmousedown : 选择元素（鼠标按下）

onmousemove : 移动元素（鼠标移动）

onmouseup : 释放元素（鼠标放开）

拖拽的问题

如果要拖拽图片，需要清除默认行为######event.preventDefault();如果拖动2个重合过后，需要把######mousemove和mouseup的事件添加给window消除影响

拖拽的范围

function onMousemove(ev){
            ev.preventDefault();

            var _top = ev.clientY - disY;
            var left = ev.clientX - disX;

            if(left<0){
                left = 0;
            }

            if(_top<0){
                _top = 0;
            }

            if( _top > window.innerHeight-obj.offsetHeight ){
                _top = window.innerHeight-obj.offsetHeight;
            }

            if( left > window.innerWidth-obj.offsetWidth ){
                left = window.innerWidth-obj.offsetWidth;
            }


            obj.style.top = _top + 'px';
            obj.style.left =  left + 'px';
            
        }