srcmini本文概要
中的对象的状态的变化被称为一个事件。在HTML中，有其表示一些活动由用户或由浏览器执行的各种事件。当JavaScript代码被包含在HTML，JS对这些事件作出反应，并允许执行。在事件反应的这一过程被称为事件处理。因此，JS处理通过事件处理程序的HTML事件。
例如，当用户通过点击浏览器，对事件进行加载JS代码，将执行任务。
一些HTML事件及其事件处理程序是：
鼠标事件
| 演出活动 | 事件处理程序 | 描述 |
|---|---|---|
| click | onclick | 当一个元素上点击鼠标 |
| mouseover | onmouseover | 当鼠标的光标来在元件 |
| mouseout | onmouseout | 当鼠标的光标离开的元件 |
| mousedown | onmousedown | 当鼠标按钮被按下在元件 |
| mouseup | onmouseup | 当鼠标按钮被释放在元件 |
| mousemove | onmousemove | 当鼠标移动发生。 |
键盘事件
| 演出活动 | 事件处理程序 | 描述 |
|---|---|---|
| Keydown & Keyup | onkeydown & onkeyup | 当用户按下然后松开按键 |
表单事件
| 演出活动 | 事件处理程序 | 描述 |
|---|---|---|
| focus | onfocus | 当用户集中的元件上 |
| submit | onsubmit | 当用户提交表单 |
| blur | onblur | 当焦点远离形式元件 |
| change | onchange | 当用户修改或改变形式元素的值 |
窗口/文档事件
| 演出活动 | 事件处理程序 | 描述 |
|---|---|---|
| load | onload | 当浏览器完成页面加载 |
| unload | onunload | 当访问者离开当前的网页，浏览器卸载它 |
| resize | onresize | 当访问者调整大小的浏览器窗口 |
让我们讨论了事件及其处理程序的一些例子。
点击事件
<html>
<head> Javascript Events </head>
<body>
<script language="Javascript" type="text/Javascript">
<!--
function clickevent()
{
document.write("This is srcmini");
}
//-->
</script>
<form>
<input type="button" onclick="clickevent()" value="Who's this?"/>
</form>
</body>
</html>鼠标悬停事件
<html>
<head>
<h1> Javascript Events </h1>
</head>
<body>
<script language="Javascript" type="text/Javascript">
<!--
function mouseoverevent()
{
alert("This is srcmini");
}
//-->
</script>
<p onmouseover="mouseoverevent()"> Keep cursor over me</p>
</body>
</html>焦点事件
<html>
<head> Javascript Events</head>
<body>
<h2> Enter something here</h2>
<input type="text" id="input1" onfocus="focusevent()"/>
<script>
<!--
function focusevent()
{
document.getElementById("input1").style.background=" aqua";
}
//-->
</script>
</body>
</html>keydown事件
<html>
<head> Javascript Events</head>
<body>
<h2> Enter something here</h2>
<input type="text" id="input1" onkeydown="keydownevent()"/>
<script>
<!--
function keydownevent()
{
document.getElementById("input1");
alert("Pressed a key");
}
//-->
</script>
</body>
</html>Load事件
<html>
<head>Javascript Events</head>
</br>
<body onload="window.alert('Page successfully loaded');">
<script>
<!--
document.write("The page is loaded successfully");
//-->
</script>
</body>
</html>
评论前必须登录！
注册