jQuery-进阶知识

2021/1/8 jQuery
// 事件绑定与取消
1. ele.on() // 在选择元素上绑定一个或多个事件的事件处理函数
  $(document).on('mousemove', 'div', function() {})
2. ele.off() // 在选择元素上移除一个或多个事件的事件处理函数
  $(document).off('mousemove', 'div', function() {})
3. ele.one() // 在选择元素上绑定一个或多个一次性的事件的事件处理函数
  $(document).off('mousemove', 'div', function() {})
----------------------------------------------------------------------------------------------
// 鼠标事件
1. ele.click() // 鼠标单击时触发,相当于 3 + 4
2. ele.dblclick() // 鼠标双击时触发
3. ele.mousedown() // 鼠标按下时触发
4. ele.mouseup() // 按下的鼠标松开时触发
5. ele.mouseenter() // 鼠标移入时触发
6. ele.mouseleave() // 鼠标移出时触发
7. ele.hover(fn, fn) // 鼠标移入和移出时触发,相当于 5 + 6
8. ele.mouseover() // 鼠标移入指定元素及其子元素时触发
9. ele.mouseout() // 鼠标移出指定元素及其子元素时触发
10. ele.mousemove() // 鼠标在 DOM 内部移动时触发
11. ele.scroll() // 当滚动指定元素时触发
----------------------------------------------------------------------------------------------
// 键盘事件
1. ele.keydown() // 当键盘或按钮按下时触发
2. ele.keypress() // 当键盘或按钮按下时触发
3. ele.keyup() // 当按钮被松开时触发
----------------------------------------------------------------------------------------------
// 其他事件
1. ready(fn) // 当 DOM 载入就绪可以查询及操纵时绑定一个要执行的函数
2. $(window).resize() // 当调整浏览器窗口的大小时触发
3. $(this).index() // 隐式迭代
4. ele.css({ 'color': 'red' })
5. ele.text('文字')
6. ele.html('<br>' + '文字')
7. ele.addClass() // 添加类
7. ele.removeClass() // 删除类
----------------------------------------------------------------------------------------------
// 表单事件
1. ele.focus() // 当元素获得焦点时触发
2. ele.blur() // 当元素失去焦点时触发
3. ele.change() // 当元素的值发生变化时触发
4. ele.select() // 当 textarea 或文本类型的 input 元素中的文本被选择时触发
----------------------------------------------------------------------------------------------
// 自定义动画
1. ele.animate({ opacity: 0.25, width: '256px', height: '256px' }, 3000)
2. ele.stop() // 停止动画
3. ele.delay(1000) // 实现动画暂停
4. ele.show(1000) // 显示 DOM 元素
5. ele.hide(1000) // 隐藏 DOM 元素
6. ele.toggle() // 显示和隐藏
7. ele.fadeIn('slow') // 动画淡入
8. ele.fadeOut('slow') // 动画淡出
9. ele.fadeToggle('slow') // 淡入淡出显示和隐藏
10. ele.slideUp() // 垂直方向收缩
11. ele.slideDown() // 垂直方向展开
12. ele.slideToggle() // 垂直切换显示和隐藏
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
Last Updated: 2024/7/31 12:57:25
    飘向北方
    那吾克热-NW,尤长靖