Event altKey,ctrlKey,shiftKey属性剖析

发布时间：2023-08-29 14:59:43 所属栏目：教程来源：

导读：event.altKey

功能：检测事件发生时Alt键是否被按住了。

语法：event.altKey

取值：true | false

说明：

altKey属性为true表示事件发生时Alt键被按下并保持，为false则Alt键没有按下。

altK

event.altKey

功能：检测事件发生时Alt键是否被按住了。

语法：event.altKey

取值：true | false

说明：

altKey属性为true表示事件发生时Alt键被按下并保持，为false则Alt键没有按下。

altKey属性可结合鼠标或键盘使用，多用于制作一些快捷操作方式。

event.ctrlKey

功能：检测事件发生时Ctrl键是否被按住了。

语法：event.ctrlKey

取值：true | false

说明：

ctrlKey属性为true表示事件发生时Ctrl键被按下并保持，为false则Ctrl键没有按下。

ctrlKey属性可结合鼠标或键盘使用，多用于制作一些快捷操作方式。

event.shiftKey

功能：检测事件发生时Shift键是否被按住了。

语法：event.shiftKey

取值：true | false

说明：

shiftKey属性为true表示事件发生时Shift键被按下并保持，为false则Shift键没有按下。

shiftKey属性可结合鼠标或键盘使用，多用于制作一些快捷操作方式。

实例1

组合操作示例。

代码如下:

<input id="txt1" type="text" value="Hello World!" onclick="checkAlt(event)" />

<script type="text/javascript">

function checkAlt(oEvent)

{

  if( oEvent.altKey )

    document.getElementById("txt1").select();

}

</script>

这段代码的效果为：

如果按住Alt键再单击上面的文本框，可以选中文本框中的文本。

实例2

组合操作示例。

代码如下:

<input id="txt2" type="text" value="Hello World!" onclick="clearText(event)" />

<script type="text/javascript">

function clearText(oEvent)

{

  if( oEvent.ctrlKey && oEvent.keyCode==46 )

    document.getElementById("txt2").value = "";

}

</script>

这段代码的效果为：

使用"Ctrl+Del"组合键可清除上面的文本框的内容。（必须先使文本框获得焦点。本例只适用于IE浏览器。）

实例3

组合操作示例。

代码如下:

<div id="box" style="width:50px; height:25px;border:1px solid black; background-color:red" onclick="setColor(event)"></div>

<script type="text/javascript">

var b = true;

function setColor(oEvent)

{

  if( oEvent.shiftKey && b )

    document.getElementById("box").style.backgroundColor = "blue";

  if( oEvent.shiftKey && !b )

    document.getElementById("box").style.backgroundColor = "red";

  b = !b;

}

</script>

这段代码的效果为：

按住"Shift"键并用鼠标点击上面的色块，可改变色块颜色

（编辑：聊城站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!