📄 ex12-7.htm
字号:
<html><head><title>鼠标事件演示 </title>
<script language="JavaScript">
<!--
function mouseEvent(arg){
switch (arg) {
case 1:
document.myForm.txtInput1.value="你单击了按钮";
break;
case 2:
document.myForm.txtInput2.value="你双击了按钮";
break;
case 3:
document.myForm.txtInput3.value="你按下了按钮";
break;
case 4:
document.myForm.txtInput4.value="你放开了按钮";
break;
case 5:
document.myForm.txtInput5.value="你在按钮上移动了鼠标指针";
break;
case 6:
document.myForm.txtInput6.value="鼠标指针离开按钮区域";
break;
case 7:
document.myForm.txtInput7.value="鼠标指针进入按钮区域";
break;
}
}
// -->
</script>
</head>
<body bgColor="lightgrey">
<h3>请将鼠标指针移动到按钮上、<br>
移出按钮、单击按钮，看看<br>
单行文本框中的文字有什么变化 <br></h3>
<form name="myForm">
<input type=text name="txtInput1" size="30" >单击事件（onClick）<br>
<input type=text name="txtInput2" size="30" >双击事件（onDblClick）<br>
<input type=text name="txtInput3" size="30" >按下事件（onMouseDown）<br>
<input type=text name="txtInput4" size="30" >放开事件（onMouseUp）<br>
<input type=text name="txtInput5" size="30" >移动事件（onMouseMove）<br>
<input type=text name="txtInput6" size="30" >离开事件（onMouseOut）<br>
<input type=text name="txtInput7" size="30" >进入事件（onMouseOver）<br>
<br>
<button onClick="mouseEvent(1)";
onDblClick="mouseEvent(2)";
onMouseDown="mouseEvent(3)";
onMouseUp="mouseEvent(4)";
onMouseMove="mouseEvent(5)";
onMouseOut="mouseEvent(6)";
onMouseOver="mouseEvent(7)"; >
<font size=+2>
测试鼠标事件
</font>
</button><br><br>
<input type=reset>
</form>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -