javascript使我们有能力创建动态页面。事件是可以被javascript侦测到的行为。网页中的每个元素都可以产生某些可以触发javascript函数的事件。那么，js中有哪些事件呢？本篇文章将给大家来介绍关于js中常用的事件。
话不多说，我们来直接进入正题。
一、js中常用事件之onclick事件
点击事件（onclick并不是js中的方法，onclick只是浏览器提供js的一个dom接口，让js可以操作dom，所以onclick大小写都是没问题的，比如html代码就不用区分大小写）。
js中onclick事件的代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript"> functionmyfunction(){ alert("测试onclick点击事件"); } </script></head><body><center><buttononclick="myfunction()">点击这里</button></center></body></html>
说明：
onclick通常在下列基本对象中产生：
button(按钮对象)、checkbox(复选框)、radio(单选框)、reset buttons(重置按钮)、submit buttons(提交按钮)
二、js中常用事件之onload事件
可以body执行，<bodyonload="alert(123)"></body>,其中onload后面可以写一个方法，如：onload="test()",然后在javascript中写一个test()方法，则在页面一开始加载的时候会先调用这个方法。
js中onload事件的代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript"> functiontest(){ alert("测试onload方法"); } </script></head><bodyonload="test()"></body></html>
注意：此方法只能写在<body>标签之中
三、js中常用事件之onchange事件
当内容改变时触发。可用于文本框、列表框等对象，该事件一般用于响应用户修改内容带来的其他改变操作。
js中onchange事件的代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript"> functionuppercase(){ varx = document.getelementbyid("fname").value; document.getelementbyid("fname").value = x.touppercase(); } </script></head><body> <p> <labelfor="name">用户名：</label> <inputtype="text"id="fname"onchange="uppercase()"value=""/></p></body></html>
说明：当用户向一个文本框中输入文本时，不会触发onchange事件，只有用户输入结束后，单击文本框以外的区域，使文本框失去焦点时才触发该事件，如果是下拉框，则选择结束后即触发。
上例的效果是，当输入框失去焦点时内容转成大写。出现这种情况是由于input必须是失去焦点才会检测到内容发生改变。而change事件通常是用于下拉菜单select标签。
四、js中常用事件之onblur事件和onfocus事件
当前元素失去焦点时触发该事件，对应的是onfocus事件：得到焦点事件；onblur事件：元素失去焦点 。
js中onblur事件和onfocus事件的代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript"> functionchkvalue(txt) { if(txt.value=="") alert("文本框里必须填写内容!"); } functionsetstyle(x){ document.getelementbyid(x).style.background="yellow" } </script></head><body>失去焦点： <inputtype="text"name="name"value=""size="30"onblur="chkvalue(this)"><br>得到焦点： <inputtype="text"id="name"value=""size="30"onfocus="setstyle(this.id)"></body></html>
五、js中常用事件之onscroll事件
窗口滚动事件：当页面滚动时调用函数。此事件写在方法的外面，且函数名后面不加括号，例如window.onscroll=move。
js中onscroll事件的代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript"> functionmove() { alert("页面滚动时调用"); }window.onscroll = move; </script></head><body>测试onscroll方法<br><br><br><br><br><br><br><br><br><br>测试onscroll方法<br><br><br><br><br><br><br><br><br><br>测试onscroll方法<br><br><br><br><br><br><br><br><br><br>测试onscroll方法<br><br><br><br><br><br><br><br><br><br></body></html>
六、js中常用事件之onsubmit事件
属于<form>表单元素，写在<form>表单标签内。语法：onsubmit=”return 函数名()”。
js中onsubmit事件的代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript"> functionmove() { alert("测试onsubmit........"+testform.name.value); } </script></head><body><formaction=""method="post"name="testform"onsubmit="returnmove()"> <inputtype="text"name="name"value=""> <br> <inputtype="submit"name="submit"value="测试onsubmit"/></form></body></html>
七、js中常用事件之鼠标相关的事件
onmouseover:鼠标移动到某对象范围的上方时，触发事件调用函数。注意：在同一个区域中，无论怎样移动都只触发一次函数。
onmouseout:鼠标离开某对象范围时，触发事件调用函数。
onmousemove:鼠标移动到某对象范围的上方时，触发事件调用函数。注意：在同一个区域中，只要鼠标动一次就触发一次事件。
代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript">functionbigimg(x){x.style.height="180px";x.style.width="180px";}functionnormalimg(x){x.style.height="128px";x.style.width="128px";}</script></head><body><imgonmousemove="bigimg(this)"onmouseout="normalimg(this)"border="0"src="images/defaultavatar.gif"alt="smiley"></body></html>
onmouseup:当鼠标松开时触发事件
onmousedown:当鼠标按下键时触发事件
代码示例：
<%@pagelanguage="java"import="java.util.*"pageencoding="utf-8"%><!doctypehtmlpublic"-//w3c//dtd html 4.01 transitional//en"><html><head><title>javascript的一些常用方法</title><scripttype="text/javascript">functionmousedown(){ document.getelementbyid("p1").style.color="red";}functionmouseup(){ document.getelementbyid("p1").style.color="green";}</script></head><body><pid="p1"onmousedown="mousedown()"onmouseup="mouseup()">请点击文本！mousedown()函数当鼠标按钮在段落上被按下时触发。此函数把文本颜色设置为红色mouseup(。) 函数在鼠标按钮被释放时触发。mouseup() 函数把文本的颜色设置为绿色。</p></body></html>
以上就是本篇文章的全部内容，更多关于js事件的内容可以参考js开发手册。
以上就是js中有哪些事件？js中常用事件的介绍的详细内容。