事件3

一.事件对象
js:
1)单击‘选择城市’，显示城市列表
获取‘选择城市’的元素，添加单击事件
事件处理程序实现为显示‘城市列表’的元素
2)单击列表项，将当前列表项的元素内容赋给显示城市元素的内容
1)获取列表项的数组
2）遍历列表项数组，为数组的每个元素添加点击事件
3）事件处理程序实现将当前列表项的元素内容赋给显示城市元素的内容
3)单击document，隐藏城市列表
为document大于对象添加点击事件
事件处理函数实现隐藏城市列表元素
js：
添加document对象的单击事件：
document.onclick = function(evt){
1）获取兼容的事件对象
2）获取兼容的事件源
3）根据不同的事件源决定使用不同的操作
a）如果事件源是<h3 id="select">选择城市</h3>
即id为"box"的元素
b）如果事件源是li元素（根据class属性值判断），则将li元素的内容赋给id为city的元素的内容，然后隐藏id为box的元素
c）否则如果事件源不是id为box的元素，则隐藏id为box的元素
}
二.通过事件对象获取键盘的信息
1.获取键盘码的方式
标准浏览器:
event.keyCode
event.which
IE低版本
event.keyCode
兼容
var event = evt || window.event;
event.keyCode是所有浏览器都兼容的
检查ctrl和alt键是否被按下:
ctrl: event.ctrlKey,按下时值为ture，否则为false
alt：event.altkey，按下时值为true，否则为false
检查win是否按下并保持
event.metaKey，按下时值为true，否则为false
在输入框输入按键字符抬起后，在控制台打印该字符的键码
案例:(05.获取按键码的用途.html)
当按下的上下左右四个方向键时，在控制台输出对应的方向键信息，如‘点击的上箭头’
案例：(06.获取ctrl和alt按键码.html)
按下ctrl键，在控制台输出‘点击了ctrl’
按下alt键，在控制台输出‘点击了alt’
1）屏蔽掉ctrl+c按键
弹出提示框，提示‘禁止复制’；
2）屏蔽右键
弹出提示框，提示‘右键禁止弹出’
三.获取鼠标指针的坐标
获取鼠标指针水平坐标：event.clientX
获取鼠标指针的垂直坐标:event.clientY
鼠标事件，在浏览器窗口的特定位置时发生,这时鼠标的位置就会记录在事件对象event中的clientX和clientY。
所有浏览器都支持

鼠标点击页面，在控制台显示鼠标指针的位置信息(鼠标指针水平坐标和鼠标指针的垂直坐标)

event中的位置总结：
clientX clientY: 浏览器窗口的左上角
layerX layerY：页面的左上角
movementX movementY：鼠标移动量
offsetX offsetY：事件触发元素的左上角
pageX pageY：页面的左上角
screenX screenY：电脑屏幕的左上角
x y：浏览器窗口的左上角
案例：（09.event中的位置.html）
1)鼠标在ul上移动，在li中显示event的位置