虽然鼠标事件主要是使用鼠标来触发的,但在按下鼠标键盘上的某些键的状态也可以影响到所要采取的操作。这些操作键就是Shift、Ctrl、Alt和Meta(在Windows键盘中是Windows键,在苹果机中是Cmd键),它们将常被用来修改鼠标事件的行为。
DOM为此规定了4个属性,表示这些修改的状态:shiftKey、ctrlKey、altKey和metaKey。这些属性中包含的都是布尔值,如果相应的键被按下了,则值为true,否则为false。当某个鼠标事件发生时,通过检测这几个属性就可以确定用于是否按下了其中的键。来看下面的例子:
var EventUtil = { getEvent: function (event) { return event ? event : window.event; }, addHandler: function (element, type, handler) { if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent("on" + type, handler); } else { element["on" + type] = handler; } }, getButton: function (event) { if (document.implementation.hasFeature("MouseEvents", "2.0")) { return event.button; } else { switch (event.button) { case 0: case 1: case 3: case 5: case 7: return 0; case 2: case 6: return 2; case 4: return 1; } } } }; var div = document.getElementById("myDiv"); EventUtil.addHandler(div, "mousedown", function (event) { event = EventUtil.getEvent(event); alert(EventUtil.getButton(event)); });
在这个例子中,我们通过一个onclik事件处理程序检测了不同修改键的状态。数组keys中包含着被按下的修改键的名称。换句话说,如果有属性值为true,就会将对应修改键的名称添加到keys数组中。在事件处理程序的最后,有一个警告框将检测到键的信息显示给用于。
Firefox、Safari、Chrome和Opera都支持这4个键。IE不支持metaKey属性。