Javascript事件机制学习

js的事件机制:当行为动作满足一定的条件后,会触发某类事务的执行,主要结合js的函数来使用。
主要内容:
1、单双击事件
单击:onclick 当鼠标单击的时候会触发
双击:ondblclick 当鼠标双击的时候会被触发
2、鼠标事件
onmouseover 当鼠标悬停在某个HTML元素上的时候触发
onmousemove 当鼠标在某个HTML元素上移动的时候触发
onmouseout 当鼠标在某个HTML元素上移出的时候触发
3、键盘事件
onkeyup 当键盘在某个HTML元素上弹起的时候触发
onkeydown 当键盘在某个HTML元素上下压的时候触发
4、焦点事件
onfocus 当某个HTML元素获取焦点的时候触发
onblur 当某个HTML元素失去焦点的时候触发
5、页面加载事件
onload 当页面加载成功后触发。

一个事件可以触发监听多个函数的执行,但是不同的函数之间要用 ; 分号隔开

代码测试

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>
  <script type="text/javascript">
   //鼠标事件
   function testOnclick(){
    alert("单击了鼠标。。。。。");
   }
   function testOndblclick(){
    alert("双击了鼠标>.......");
   }
   //键盘事件
    function testOnkeyup(){
     alert("键盘弹起");
    }
    
    function testOnkeydown(){
     alert("键盘按下");
    }
   //页面加载
    function testOnload(){
     alert("页面加载");
    }
  </script>
 </head>
 <body onload="testOnload()">
  <input type="button" name="" id="" value="单击"onclick="testOnclick()" /></br>
  <input type="button" name="" id="" value="双击"ondblclick="testOndblclick()" /></br>
  <br>测试键盘按下<input type="text" name="" id="" value=""onkeyup="testOnkeyup()" />
 </body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值