页面

1、什么是页面事件？

window.event代表着事件对象的状态。只有在事件发生时生效。如鼠标、键盘等事件被触发时这个对象才存在。window.event这只在IE下是这样的。他并不是标准。。也就是说其他浏览器并不支持。在W3C标准支持的浏览器下事件对向是引发事件涵数的第一个参数，参数名随意,在下面的例子中我的事件对象的参数名是evt,也可以定义为其他名字．为了兼容IE浏览器可以这样写

 <div id="obj"></div>
<script type="text/javascript">
document.getElementById("obj").οnclick=function(evt){
//获取的这个ID为obj的DIV对象就是个实例引起鼠标事件的元素
//evt代表事件对象（W3C DOM标准下）
var evt=evt || event; //标准化事件对象（W3C DOM 和IE DOM ）
evt.Target=evt.Target || evt.srcElement;//标准化事件对象属性<引起事件的元素>
                                                              //（W3C DOM 和IE DOM ）
evt.layerX=evt.layerX || evt.offsetX;//鼠标相对于引起事件的元素的父元素的X坐标(标准化IE)
evt.layerY=evt.layerY || evt.offsetY;//鼠标相对于引起事件的元素的父元素的Y坐标(标准化IE)
alert("相对这个DIV的X方向的坐标"+evt.layerX+"\n相对这个DIV的Y方向的坐标"+evt.layerY)
}
</script>

2、js中的代码介绍

var evt=window.event||e; // 这句话是跨浏览器的写法，在IE/Opera中，是window.event，而在Firefox中，是e

而事件的对象，在IE中是window.event.srcElement，在Firefox中是event.target，而在Opera中则两者都支持。

keyCode：监听键盘按下的是哪个键。键盘上的多数键都对应着一个一个ASCII码，比如输入“0”，那么keyCode=48,因为0在ASCII码中对应的值就是48.而对于ctrl、alt、shift这种键，判断方式又不一样，

if(event.shiftKey==true) { alert("你按了shift") } 
if(event.ctrlKey==true) { alert("你按了ctrl") }
if(event.altKey==true) { alert("你按了alt") }
//***********************************
这里顺便说一下判断鼠标按键的问题。 
在 IE 里面 
左键是 window.event.button = 1 
右键是 window.event.button = 2
中键是 window.event.button = 4
没有按键动作的时候 window.event.button = 0
在 Firefox 里面 
左键是 event.button = 0 
右键是 event.button = 2
中键是 event.button = 1 
没有按键动作的时候 event.button = 0
在 Opera 7.23/7.54 里面 
鼠标左键是 window.event.button = 1
没有按键动作的时候 window.event.button = 1 
右键和中键无法获取 
而在 Opera 7.60/8.0 里面 
鼠标左键是 window.event.button = 0
没有按键动作的时候 window.event.button = 0
右键和中键无法获取 
下面我们写一个能在 IE4.01+/Firefox 0.9+/Opera 7.23+ 环境中均能运行正常的小程序，功能是用鼠标拖动层。 
//***********************************

可用鼠标拖动的层
var moving = false; 
var initX = 0; 
var initY = 0; 
//******************* 
// 获取触发事件的对象 
//******************* 
function findSrc(evt) 
{ 
return( evt.target evt.target : evt.srcElement ); 
} 
function start(evt) 
{ 
//按下鼠标左键才允许移动 
//evt.button == 1 IE/Opera 7.23/7.54 
//evt.button == 0 Firefox/Opera 7.6+ 
if ( evt.button == 1 || evt.button == 0) 
{ 
moving = true; 
initX = evt.offsetX evt.offsetX : evt.layerX; 
initY = evt.offsetY evt.offsetY : evt.layerY; 
findSrc( evt ).style.cursor = "move"; 
window.status = "开始(button=" + evt.button + ")"; 
} else { 
stop( evt ); 
} 
} 
function stop( evt ) 
{ 
moving = false; 
findSrc( evt ).style.cursor = ""; 
window.status = "结束(button=" + evt.button + ")"; 
} 
function move(evt) 
{ 
//按下鼠标左键才允许移动 
//evt.button == 1 IE/Opera 7.23/7.54 
//evt.button == 0 Firefox/Opera 7.6+ 
if (moving && ( evt.button == 1 || evt.button == 0 )) 
{ 
var intx = document.body.scrollLeft + evt.clientX; //获取当前鼠标位置的X坐标 
var inty = document.body.scrollTop + evt.clientY; //获取当前鼠标位置的Y坐标 
var div = findSrc( evt ); 
div.style.top = inty - initY; 
div.style.left = intx - initX; 
window.status = "X=" + intx + " Y=" + inty + " button=" + evt.button; 
} else { 
window.status = "已停止(button=" + evt.button + ")"; 
} 
}
//-->