jQuery事件

鼠标事件

类型1

  1. click 鼠标单击时触发
  2. dblclick 鼠标双击时触发
    总结
  3. 双击事件是由两次单击完成,所以双击事件执行的时候必定会触发单击事件。
  4. 一般情况下,单击双击分开执行,不会一起执行。

类型2

  1. mousedown 鼠标按下时触发
  2. mouseup 按下鼠标放松时触发

类型3

  1. mouseenter 鼠标进入时触发
  2. mouseleave 鼠标移出时触发
  3. hover (over,out) 鼠标进入和退出时触发两个函数 ,相当于mouseenter和mouseleave

类型4

  1. mouseover 鼠标进入指定元素及其子元素时触发
  2. mouseout 鼠标移出指定元素及其子元素时触发
  3. mousemove 在DOM内部移动时发生这个事件
    总结:很多捣蛋程序通过mousemove做出来的。
    拖拽文件上传用到!

类型5

  1. scroll 当滚动这个元素时会发生这个事件

键盘事件

类型1

  1. keydown 当键盘或者按钮被按下时,触发keydown事件。
    总结:
  2. 有时候我们通过获取key值判断按下什么键
  3. 可以通过获取键位获取输入什么键
  4. 通过keycode:ASCII值判断

类型2

  1. keyup 当按钮松开时,触发keyup事件,发生在当前获得焦点的元素上。
    总结:
  2. 现在的浏览器基本上可以使用keydown和keyup,发生在当前获得焦点的元素上
  3. 旧浏览器保留一个keypress事件

类型3

  1. keypress 当键盘或者按钮按下时,发生keypress事件
    总结:
  2. 独特在于必须输入内容才会触发
  3. 比如输入法、回退,Ctrl, alt不会触发的
  4. 现在版本和keypress keydown几乎没有区别

其他事件

  1. ready() 当DOM载入就绪可以查询或者操纵时绑定一个要执行的函数
//页面就绪函数
//原始格式
$(document).ready(function(){....});

//缩写形式
$().ready(function(){....});

//再缩写
$(function(){});
  1. resize() 当浏览器调整浏览器窗口大小时,触发事件
$(window).resize(function(){
    console.log($(this));
 });
  1. focus()/blur() 当元素获得或者失去焦点时触发事件,适用于input、textarea

  2. change() 当元素得值发生改变时,发生change事件
    • 当focus()、blur()、change()一起时,触发的先后顺序
    在这里插入图片描述
    在这里插入图片描述

  3. select() 当textarea或者文本类型的input文本被 选择时,会发生select事件
    在这里插入图片描述在这里插入图片描述
    总结:只有可编辑的文本和文本域等可以产生select事件

  4. submit() 当提交表单时,发生submit事件
    • submit具有三个功能
    a.提交表单(让普通按钮具有提交功能)
    b.阻止提交表单
    c.表单验证

总结:
1.button不在form就是普通按钮
2. button在form中,相当于submit提交按钮
3. button是html5新增的
4. 在ie中就是普通按钮
5. 在非ie中就是提交按钮

事件参数

Event – 我们需要通过event获取鼠标位置和键盘位置,否则监听事件无意义
所有事件都会传入event对象作为参数,可以从event对象上获取很多信息;

事件绑定和取消

  1. on(events,[selector],[data],fn) 在选择元素上绑定一个或多个事件的事件处理函数
  2. add()方法表示将元素添加到已存在的元素组合中
    a. 语法:$(选择器).add(element,context)
  3. off(events,[selector],[data],fn) 在选择元素上移除一个或者多个事件处理函数
  4. one(type,[data],fn) 为每一个匹配元素的特定事件(比如click)绑定一个一次性的时间处理函数
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值