暑期学习日记23：事件处理

土肥圆波太郎

于 2022-08-07 22:15:23 发布

阅读量91

点赞数

文章标签：学习

本文链接：https://blog.csdn.net/weixin_48485475/article/details/126218232

版权

1.点击事件：onclick。鼠标单击时发生的事件。

2.改变事件：onchange。元素内的字符串或选择状态改变时发生的事件。

3.选中事件：onselect。元素被选中时发生的事件。

4.获得焦点事件：onfocus。鼠标落在文本框或选择框内发生的事件。

5.失去焦点事件：onblur。与获得焦点事件相对，不再获得焦点时发生的事件。

6.载入文件事件：onload。页面文件载入时发生的事件。

7.鼠标覆盖事件：onmouseover。鼠标位于元素上方发生的事件。

8.鼠标离开事件：onmouseout。鼠标离开元素时发生的事件。可和鼠标覆盖事件一起使用创建动态按钮的效果。

9.鼠标双击事件：ondbclick。鼠标双击时发生的事件。

10.Onkeypress：键盘某个按键被按下并释放时引发的事件，要求页面内有被激活的对象。

11.Onkeydown:键盘某个按键被按下引发的事件，要求页面内有被激活的对象。

12.Onkeyup:键盘某个按键被放开引发的事件，要求页面内有被激活的对象。

（1）改变事件如：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>事件</title>
</head>
<body>
	<input type="text" onchange=javascript:alert("我改变了")>
</body>
</html>

在改变输入框内的值后显示效果为：

（2）失去焦点事件如：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>事件</title>
</head>
<body>
	<input type="text" id="input1" onblur="f1()">
</body>
	<script>
	function f1(){
		var a1=document.getElementById("input1").value;
		alert("你输入的是"+a1)
	}
	</script>
</html>

显示效果为：