jQuery入门第七章(事件)

简介: jQuery入门第七章(事件)

事件解绑


解绑事件


$(选择器).off('事件类型');


如果要针对性解绑某个事件处理函数,需要把事件处理函数起个名字,再名字解绑。


$(选择器).off('事件类型', 事件处理函数名称);


事件对象


基本概念


每个事件在触发的时候,都有事件对象,记录了事件触发时候的一些信息。


如何获取事件对象


在事件处理函数写个形参名称,常用的名字 event , ev , e 。


  • 鼠标事件对象中,可以获取鼠标坐标值 , clientX, clientX ,pageX, pageY


  • 键盘事件对象中,可以获取键盘按键编码,keyCode , which


$('选择器').mousemove(function (e) {
    // 从事件对象中提取 鼠标坐标值
    const { clientX, clientY } = e;
});
$('选择器').keyup(function (e) {
    // 获取键盘事件的编码
    const { keyCode } = e;
});


阻止冒泡


注意事件委托不要阻止冒泡,否则就委托失败了。


e.stopPropagation();


阻止默认行为


常见的默认行为:


  • Ctrl+C 能复制网页内容


  • 表单域中的 submit 按钮,点击的时候会默认提交表单。


e.preventDefault();


相关文章
N..
|
2天前
|
JavaScript 前端开发
jQuery事件处理
jQuery事件处理
N..
13 1
|
2天前
|
JavaScript
jquery动画与事件案例
jquery动画与事件案例
12 0
|
2天前
|
JavaScript 前端开发 索引
JQuery样式操作、click事件以及索引值-选项卡应用示例
JQuery样式操作、click事件以及索引值-选项卡应用示例
23 1
|
2天前
|
JavaScript 前端开发 C++
【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?
【5月更文挑战第2天】【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?
|
2天前
|
Web App开发 JavaScript 前端开发
jquery的冒泡事件event.stopPropagation()
jquery的冒泡事件event.stopPropagation()
8 0
|
2天前
|
JavaScript 前端开发
jQuery中的事件与动画
jQuery中的事件与动画
10 0
|
2天前
|
JavaScript
jQuery动画与事件概念以及语法
jQuery动画与事件概念以及语法
10 0
|
2天前
|
JavaScript
jQuery事件2-第6次课-给未来的元素绑事件-事件对象-JS盒模型-附案例、任务
jQuery事件2-第6次课-给未来的元素绑事件-事件对象-JS盒模型-附案例、任务
43 0
|
2天前
|
JavaScript 前端开发
jQuery事件1-第5次课-JQ的事件跟JS一样的作用,只是写法不一样-附案例、任务
jQuery事件1-第5次课-JQ的事件跟JS一样的作用,只是写法不一样-附案例、任务
41 0
|
2天前
|
JavaScript 前端开发
jQuery 第三章(语法+选择器+事件)
jQuery 第三章(语法+选择器+事件)
41 1