• module5-05-jQuery 事件操作和插件


    jQuery 事件操作和插件

    一、事件操作

    1.1 事件绑定

    (1)简单方式注册事件

    • 语法:JQ对象.事件名(如click)(事件处理函数)

      • 这种注册方式相当于onclick,只能绑定一个后面会覆盖前面

    (2)on 方法注册事件

    ① 注册简单事件语法:

    • JQ对象.on('事件名', 事件处理函数)

    • 相当于addEventListener

    ② 事件委托实现:

    • JQ对象.on('事件名', '选择器', 事件处理函数)

    • 参数中的选择器必须是后代选择器

    (3)off 方法解除事件绑定

    • off可以解绑简单绑定的事件,也可以解绑委托注册的事件

    1.2 触发事件

    • 当想在程序里面实现一个DOM元素的点击或者什么的时候可以用这个触发事件的功能

    • 语法:

      • JQ对象.trigger('事件名')

    1.3 JQ事件对象

    • 相当于事件函数的e,在JQ中棒我们重新封装了

    鼠标事件对象相关属性

    • clidntX / Y:参照浏览器

    • pagheX / Y:参照文档

    • offsetX / Y:参照元素

      • position

    键盘事件对象相关属性

    • 事件对象.keyCode返回键码数字

    • 事件对象.altKey / shiftKey / ctrlKey:可以检测键盘是否按下,并返回布尔值

    公共的属性或方法

    • 属性

      事件对象.target:最初触发事件的DOM元素

      事件对象.currentTarget:在事件冒泡阶段中的当前DOM元素

    • 方法

      事件对象.preventDefault():阻止默认行为

      事件对象.stopPropagation():阻止事件冒泡

    二、多库共存

    2.1 关于$冲突问题

    (1)解决方法1

    • jQuery不使用$,使用jQuery

    (2)解决方法2

    • jQuery库释放$符号的使用权限,用其他建房符号代替

    • jQuery.noConflict():释放$,把$所代表的对象作为返回值返回

    三、jQuery插件的使用

    3.1 如何获取插件

    3.2 插件使用方法

    • ① 复制借勾,保证结构关系一直,标签名不一致无所谓

    • ② 样式,可以复制样式,也可以定义自己想要的样式

    • ③ 先引入jQuery文件,再引入插进库文件

    • ④ 复制源代码查看文档使用

    3.3 插件案例

  • 相关阅读:
    codeforces 439C 模拟
    codeforces 435B
    【WebVR】AFrame中的A-sky无法利用src指定路径显示全景图
    【UE4】添加头文件之后VS中UCLASS()报错问题解决办法
    【UE4】蓝图之间的通讯
    git中报unable to auto-detect email address 错误的解决办法
    2017ACM省赛总结与生涯回顾
    hihocoder#1121 : 二分图一•二分图判定
    hihocoder#1039 : 字符消除
    2048low版
  • 原文地址:https://www.cnblogs.com/lezaizhu/p/14275701.html
Copyright © 2020-2023  润新知