JavaScript中的常⽤事件
JS中的事件：
概念：某些组件被执⾏了某些操作后，触发某些代码的执⾏。
事件：某些操作。如： 单击，双击，键盘按下了，⿏标移动了
事件源：组件。如： 按钮 ⽂本输⼊框…
：代码。
注册监听：将事件，事件源，结合在⼀起。 当事件源上发⽣了某个事件，则触发执⾏某个代码。
1、常⽤事件
1.点击事件：
onclick：单击事件
ondblclick：双击事件
2.焦点事件
onblur：失去焦点
onfocus：元素获得焦点。
3.加载事件：
onload：⼀张页⾯或⼀幅图像完成加载。
4.⿏标事件：
onmousedown ⿏标按钮被按下。
onmouseup ⿏标按键被松开。
onmousemove ⿏标被移动。
onmouseover ⿏标移到某元素之上。
onmouseout ⿏标从某元素移开。
5.键盘事件：
onkeydown 某个键盘按键被按下。
onkeyup 某个键盘按键被松开。
onkeypress 某个键盘按键被按下并松开。
6.选择和改变
onchange 域的内容被改变。
onselect ⽂本被选中。
7.表单事件：
onsubmit 确认按钮被点击。
onreset 重置按钮被点击。
2、回调函数
java中也有回调函数机制：
public class MyClass{
public static void main(String[] args){
// 主动调⽤run()⽅法，站在这个⾓度看run()⽅法叫做正向调⽤。
run();
}
// 站在run⽅法的编写者⾓度来看这个⽅法，把run⽅法叫做回调函数。
public static void run(){
System.out.println("");
}
}
js中回调函数:
回调函数的特点: ⾃⼰把这个函数代码写出来了，但是这个函数不是⾃⼰负责调⽤，由其他程序负责调⽤该函数.
// 对于当前程序来说,sayHello函数被称为回调函数(callback函数)
// 回调函数的特点:⾃⼰把这个函数代码写出来了，但是这个函数不是⾃⼰负责调⽤，由其他程序负责调⽤该函数.
function sayHello(){
alert("hello~~");
}
3、事件的注册
3.1、什么是事件的注册（绑定）？
其实就是告诉浏览器，当事件响应后要执⾏哪些操作代码，叫事件注册或事件绑定。
3.2、注册事件的两种⽅式（静态注册事件、动态注册事件）
静态注册事件：通过 html 标签的事件属性直接赋于事件响应后的代码，这种⽅式我们叫静态注册。
function sayHello(){
alert("hello js!");
}
<!--注册事件的第⼀种⽅式，直接在标签中使⽤事件句柄-->
<!--以下代码的含义是：将sayHello函数注册到钮上，等待click事件发⽣之后，
该函数被浏览器调⽤。我们称这个函数为回调函数。-->
<input type="button" value="hello" onclick="sayHello()"/>
动态注册事件： 是指先通过 js 代码得到标签的 dom 对象，然后再通过 dom 对象.事件名 =function(){}这种形式赋于事件响应后的代码，叫动态注册。
动态注册基本步骤：
1、获取标签对象
2、标签对象.事件名 =fucntion(){}
<!--第⼆种注册事件的⽅式，是使⽤纯JS代码完成事件的注册。-->
<input type="button" value="hello1" id="mybtn1"/>
<input type="button" value="hello2" id="mybtn2"/>
<input type="button" value="hello3" id="mybtn3"/>
<script type="text/javascript">
function dynamic(){
alert("动态注册事件1");
}
// 第⼀步：先获取这个钮对象()
/
*
document：是 JavaScript语⾔提供的⼀个对象（⽂档 ), document是 JavaScript语⾔提供的⼀个对象（⽂档 ),        get: 获取
Element：元素（就是标签
By：通过。。由。。经。。。
Id: id 属性
getElementById: 通过 id 属性获取标签对
*/
var btnobj1 = ElementById("mybtn1");
// 第⼆步：给钮对象的onclick属性赋值
// 这⾏代码的含义是，将回调函数doSome注册到click事件上.
var btnobj2 = ElementById("mybtn2");
alert("动态注册事件2");// 这个函数在页⾯打开的时候只是注册上，不会被调⽤，在click事件发⽣之后才会调⽤.
}
alert("动态注册事件3");
}input绑定onblur事件
</script>
4.通过keydown事件演⽰回车键13，ESC键27
<body>
<script type="text/javascript">
// 回车键的键值是13
// ESC键的键值是27
/*  var keyvalue = ElementById("key");
// 获取键值对象
alert(event);// 什么键显⽰都为[object KeyboardEvent]
// 对于“键盘事件对象"来说，都keyCode属性⽤来获取键值.
alert(event.keyCode);//回车键显⽰13
}
*/
var keyvalue = ElementById("key");
if(event.keyCode ==13){
alert("正在进⾏验证")
}
}
}
</script>
<input type="text" id="key"/>
</body>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。